Ich bin auf ein ziemlich groĂźes Projekt gestoĂźen, das in React + Typescript geschrieben wurde.
Den Code eingegraben. Alles ist cool, Container, Komponenten, Typen sind ĂĽberall, der Linter ist konfiguriert, gestaltete Komponenten, sogar das Storybook hat eine bestimmte Reaktionsabfrage.
Nun, nur GlĂĽck, kein Projekt!
Ich setze mich hin, um eine einfache Aufgabe zu erledigen - eine Seite aus Komponenten zusammenzusetzen.
Ich schreibe in Code Aber ... und die IDE bietet mir 16 Button-Komponenten.
Bliiin ...
Okay, ich habe Komponente / Button von den Komponenten bekommen (zs er ist der einzige dort)
Next Inp ... nun, Sie haben die Idee. 23 Teile dieser Eingabe während des gesamten Projekts.
Okay, ich denke, als ich das Bilderbuch öffnete, beschloss ich, alles von dort zu kopieren. Und es gibt nur einfache Komponenten wie Tasten, H1, H3. Und keine Komponenten mit einem Zustand für Sie - keine Formen, kein Zeichen mit Werten.
Meinem GlĂĽck sind keine Grenzen gesetzt.
Ich grabe weiter. Es stellt sich heraus, dass Container nicht nur Container enthalten ( tatsächlich hatte ich immer eine Frage zu diesem Wort, ich mag eher die Namensseite oder Unterseite / Abschnitt ), sondern auch die Komponenten, die direkt mit dieser Seite zusammenhängen.
Gemäß den Klassikern des Genres wurde nicht alles in wiederverwendbaren Komponenten herausgenommen, und 4-5 große Komponenten wurden einfach in verschiedene Container (Containerordner) kopiert, in denen sie verwendet wurden.
, .
– (...)
C , . , .
. . , ?
.
, , , , .
« Front End-» ( -).
:
1) //// !
2) “// TODO:ID description” (ID 1)
3) , TODO
?
, TODO- 2-3 , ( 1-2 ).
TODO :
-, , ( CTRL + SHIFT + F // TODO:ID, - , 23 )
-, -. TODO , – .
, "TODO - " . , – technical debt.
.
1.
Linear ( ):
, . , .
, :
Add stories – storybook stories .
Move components into components – (reusable) . .
2.
styled-component- ( )
// TODO , ( ).
, …
TODO?
.
containers.
Linear. ID.
,
Windows + V ( – , , )
, TODO Windows + V .
, , .
. (Ctrl + Shift + V).
,
`const Button =`
`// TODO: TFR-45:Button…
const Button =`
!
3.
.
TFR-44 TFR-45 TODO ID - . - , .
, , , ?
. 16 Button 23 Input node.js .
:
1. “// TODO ID…“ “};” “Folder( )+ComponentName”.
styled-component
2. , . .
, .
3. - – , , , ..
: https://github.com/DrBoria/component-mover
styled-components.
«};».
.
– , // TODO end , “// TODO ID…“ “// TODO end”.
, .
- , .
– 1 .
.. – ? ?
.
( ).
!
, .
TODO- .
, .
1) . .
2) , ( - )
3) ( , )
Wie mein Vater sagt - einige Pluspunkte, wie ein Friedhof.