Mengapa kami membutuhkan tim Frontend Core khusus dan bagaimana kami menerapkan sistem desain



Halo semuanya, nama saya Rostislav, saya memegang posisi Pimpinan Depan di DomClick. Saya ingin berbagi dengan Anda pengalaman membuat tim Front Core dan segera menjawab pertanyaan berikut:



  • Apakah tim seperti itu diperlukan di perusahaan?


Setelah satu tahun keberadaan tim Front Core, setiap orang memiliki pemahaman bahwa hal itu diperlukan di perusahaan besar, tetapi tidak di perusahaan rintisan.



  • ?


. , , P&L , β€” . , , , .



  • ?


β€” , . , .



  • ?


β€” , .





Front Core , frontend β€” .



, , -, . - , , , UX- , , , , . .



. : , , npm-. storybook, API, , , . Web Core, , .



- UI-KIT



:



  • ;
  • ;
  • ;
  • (UX);
  • , .


:



  • β€” , , , .
  • UI-KIT β€” , .
  • () β€” UI-KIT .
  • β€” . , , , .




, -. , , . , , . UI-KIT.



β€” .





. .





, .





. React β€” . Typescript , . -? -, , . -, .



:





, , . , . SemVer, .. -; API β€” -; API , β€” -.



β€” .





: UI-KIT, . tree shaking, , .



:



  • , UX . - - UI-KIT, Web Core-.


:



  • UI-KIT , , API . - * - , .
  • .




β€” UI-KIT . SemVer.



:



  • .
  • UI-KIT .


:



  • , . ncu --filter /@ui-kit/ -mu && npm i, @ui-kit β€” scope .


, . npm-, , .



, . ? : Lerna RushJS.



, Rush β€” . ? Lerna , , . . Rush : change- , , changelog, , . Rush Git . , .



Rush:







ESM ESNext tree-shaking Rollup, Webpack 5, . , . : , . , , . : browserlist , , . SSR-, NodeJS, CommonJS-.





CSS- Sass .



:



. , , , . . css-modules generateScopedName:'[local]-${projectManifest.version}', projectManifest β€” package.json. .



. styles-framework, , , , . .



, CSS in JS. , , .





, SVG-. CDN , . ( ) , . React-, SVG-. , SVG- IconComponent, fill currentColor SVG-o, , .





, , . : open-source , , , , , . , -, .





, ? , , , .





user-agent . .





:





:



  • ( ).
  • , .




, :



  • API .
  • . open source-, , . , , «».
  • . , , - .
  • . .
  • . . - API, - , - . . , .




.





, , .





. CHANGELOG.md, Rush.





Readme Readme, .





frontend (React)-, product owner’. PO . , -, UI-KIT , , UX/UI. , , .





Web Core . , , .. . , . . , - . ! !




All Articles