ប្រហែលជាប្រហែលជាប្រហែលជាប្រហែលជាប្រហែលជាប្រហែលជាប្រហែលជាប្រហែលជាប្រហែលជាប្រហែលជាប្រហែលជាប្រហែលជាប្រហែលជាប្រហែលជាប្រហែលជាប្រហែលជាប្រហែលជាប្រហែលជាប្រហែលជាប្រហែលជាប្រហែលជាប្រហែលជាប្រហែលជាប្រហែលជាប្រហែលជាប្រហែលជាប្រហែលជាប្រហែលជាប្រហែលជាប្រហែលជាប្រហែលជាប្រហែលជាប្រហែលជាប្រហែលជាប្រហែលជាប្រហែលជាប្រហែលជាប្រហែលជាប្រហែលជាប្រហែលជាប្រហែលជាប្រហែលជាប្រហែលជាប្រហែលជាប្រហែលជាប្រហែលជាប្រហែលជាប្រហែលជាប្រហែលសម្ភារៈសម្ភារៈសម្ភារៈសម្ភារៈតម្រូវការ CSS ការផ្លាស់ប្តូរគឺជាការឆាប់រហ័ស។ អត្ថបទនេះគឺជាការផ្លាស់ប្តូរនៃការផ្លាស់ប្តូររបស់យើងពី Styled Components ទៅ Tailwind CSS, ហេតុអ្វីដែលយើងបានធ្វើការផ្លាស់ប្តូរនេះ, តើខ្ញុំបានជួបការផ្លាស់ប្តូរនេះដូច្នេះហើយដំណើរការនេះបានមើលទៅដូចគ្នានេះនៅពេលនេះ។ ប្រសិនបើអ្នកកំពុងធ្វើការជាមួយប្រភេទប្រវត្តិសាស្ត្រឬការគិតពី Tailwind សម្រាប់គម្រោងរបស់អ្នកគួរឱ្យចាប់អារម្មណ៍ថាវាផ្តល់ឱ្យអ្នកនូវអ្វីដែលមានប្រសិទ្ធិភាព (ឬប្រសិនបើមានប្រសិទ្ធិភាព) ដើម្បីដោះស្រាយជាមួយ។ ខ្ញុំមិនជាផ្នែកមួយនៃក្រុមនេះនៅពេលដែល Styled Components ត្រូវបានជ្រើសរើសជាលើកដំបូងដើម្បីគ្រប់គ្រង CSS របស់យើងប៉ុន្តែនៅពេលនេះ, Tailwind CSS មិនត្រូវបានចេញផ្សាយ។ និង Styled Components បានធ្វើឱ្យគួរឱ្យចាប់អារម្មណ៍ជាច្រើនសម្រាប់អគ្គិសនី front-end នៃ HackerNoon ។ វាត្រូវបានអនុញ្ញាតឱ្យអ្នកអភិវឌ្ឍន៍ដើម្បីសរសេរ CSS ដោយផ្ទាល់នៅក្នុង JavaScript ដែលធ្វើឱ្យសមាសភាគដោយខ្លួនឯងដោយខ្លួនឯង។ គោលបំណងនេះគួរឱ្យចាប់អារម្មណ៍ថាជា " react-native" ជាធម្មជាតិ - encapsulated, reusable, និងនៅពេលនេះគួរឱ្យចាប់អារម្មណ៍ថាវាគឺជាការងាយស្រួលក្នុងការរក្សាទុក នៅលើមូលដ្ឋានកូដនិងក្រុមប្រជុំវិញ។ សមត្ថភាពរចនាសម្ព័ន្ធចនាសម្ព័ន្ធចនាសម្ព័ន្ធចនាសម្ព័ន្ធដែលមានមូលដ្ឋាននៅក្នុងគំរូការគាំទ្រនិងសមត្ថភាពដើម្បីផ្លាស់ប្តូរគោលបំណងដោយផ្ទាល់ទៅក្នុងប្រភេទបានធ្វើបានយ៉ាងល្អបំផុតសម្រាប់ទំហំទូលាយនៃទំព័រនិងការរចនាស encapsulated, reusable, និង, នៅពេលដែលវាត្រូវបានគិតថាជាការងាយស្រួលក្នុងការរក្សាទុកComponents Styled បានផ្គត់ផ្គង់ HackerNoon ល្អ។ ជាមួយនឹងពេលវេលាកម្រិតកម្រិតកម្រិតកម្រិតកម្រិតកម្រិតកម្រិតកម្រិតកម្រិតកម្រិតកម្រិតកម្រិតកម្រិត។ Styled Components បានផ្តល់ឱ្យយើងនូវភាពងាយស្រួលប៉ុណ្ណោះប៉ុណ្ណោះប៉ុណ្ណោះដោយមានតម្លៃ: ទំហំ bundle ទំហំ bundle ទំហំប្រតិបត្តិការ ទំហំប្រតិបត្តិការ ទំហំប្រតិបត្តិការ ទំហំប្រតិបត្តិការ ទំហំប្រតិបត្តិការ ទំហំប្រតិបត្តិការ ទំហំប្រតិបត្តិការ ទំហំប្រតិបត្តិការ ទំហំប្រតិបត្តិការ ទំហំប្រតិបត្តិការ ទំហំប្រតិបត្តិការ ទំហំប្រតិបត្តិការ ។ទំហំទូលំទូលំទូលំទូលាយ ការប្រកួតប្រជែងពេលបច្ចុប្បន្ន។រចនាសម្ព័ន្ធឧបករណ៍កាត់បន្ថយ យើងក៏បានមើលឃើញថ្នាំរបស់យើងជាច្រើនត្រូវបានប្រែប្រែប្រែប្រែប្រែប្រែប្រែប្រែប្រែប្រែប្រែប្រែប្រែប្រែប្រែប្រែប្រែប្រែប្រែប្រែប្រែប្រែប្រែប្រែប្រែប្រែប្រែប្រែប្រែប្រែប្រែប្រែប្រែប្រែប្រែប្រែប្រែប្រែប្រែប្រែប្រែប្រែប្រែប្រែប្រែប្រែប្រែប្រែប្រែប្រែប្រែប្រែប្រែប្រែប្រែប្រែប្រែប្រែប្រែប្រែប្រែប្រែប្រែប្រែប្រែប្រែប្រែប្រែប្រែប្រែប្រែប្រែប្រែប្រែប្រែប្រែប្រែប្រែប្រែប្រែប្រែប្រែប្រែប្រែប្រែប្រែប្រែប្រែប្រែប្រែប្រែតម្រូវការ CSS ប៉ុន្តែយើងគួរតែជាពិតប្រាកដ: សម្រាប់ក្រុមអ្នកអភិវឌ្ឍន៍ ទទទទទទទទទទទទទទទទទទទទទទទទទទទទទទទទទទទទទទទទទទទទទទទទទទទទទទទទទទទទទទទទទទទទទទទទទទទទទទទទទទទទទទទទទទទទទទទទទទទទទទទទទទទទទទទទទទទទទទទទទទទទទទទទទទទទទទទទទទទទទទទទទទទទទទទទទទទទទទទទទទទទទទទទទទទទទក្រុមអភិវឌ្ឍន៍តូចដូចជា HackerNoon'sបន្ទាត់ដោយបន្ទាត់ តម្រូវការបំផុតនៃការផ្លាស់ប្តូរនេះ? Setup. ការដំឡើង Tailwind គឺជាការងាយស្រួលប៉ុន្តែបន្ទាប់ពីវាត្រូវបានដំឡើង, ប្រភេទពិភពលោកនៃ Tailwind - ដោយសារតែការ Preflight - បានចាប់ផ្តើមដំឡើងជាមួយនឹងផ្នែកដែលយើងមាន។ ប្រភេទត្រូវបានបាត់បន្ថយខាងលិចនិងខាងលិច។ A lifesaver here was setting ពីទីនេះខ្ញុំគួរតែ កំណត់ធម្មតានិងធម្មតានិងធម្មតានិងធម្មតានិងធម្មតានិងធម្មតានិងធម្មតានិងធម្មតានិងធម្មតានិងធម្មតានិងធម្មតានិងធម្មតានិងធម្មតានិងធម្មតានិងធម្មតានិងធម្មតានិងធម្មតានិងធម្មតានិងធម្មតានិងធម្មតានិងធម្មតានិងធម្មតានិងធម្មតានិងធម្មតាន។ បានបង្កើតសកម្មភាពថ្មី និងទីនេះគឺជាផ្នែកមួយដែលខ្ញុំនៅតែមានអារម្មណ៍: AI បានធ្វើឱ្យដំណើរការនេះមានភាពងាយស្រួល។ ការកំណត់កំណត់កំណត់កំណត់កំណត់កំណត់កំណត់កំណត់កំណត់កំណត់កំណត់កំណត់កំណត់កំណត់កំណត់កំណត់កំណត់កំណត់កំណត់កំណត់កំណត់កំណត់កំណត់កំណត់កំណត់កំណត់កំណត់កំណត់កំណត់កំណត់កំណត់កំណត់កំណត់កំណត់កំណត់កំណត់កំណត់កំណត់កំណត់កំណត់កំណត់កំណត់កំណត់កំណត់កំណត់កំណត់កំណត់កំណត់កំណត់កំណត់កំណត់កំណត់កំណត់កំណត់កំណត់កំណត់កំណត់កំណត់កំណត់កំណត់កំណត់កំណត់កំណត់កំណត់កំណ ឥឡូវនេះ, សូមអរគុណចំពោះខ្ញុំ: AI មិនបានទទួលបានអ្វីគ្រប់យ៉ាង។ ឧបករណ៍ដែលមានតម្រូវការច្នៃប្រឌិតនិងមានតម្រូវការច្នៃប្រឌិតច្នៃប្រឌិតច្នៃប្រឌិតច្នៃប្រឌិតច្នៃប្រឌិតនិងពេលវេលាជាច្រើន ខ្ញុំនឹងនិយាយថា អ៊ីនធឺណិតគឺឥឡូវនេះនៅលើ HackerNoon! 🎉 As of now, the HackerNoon Homepage is fully converted to Tailwind CSS, with Styled Components completely removed. Most of the other pages still rely on Styled Components, and they’ll be converted gradually—one component, one page at a time. ប្រសិនបើវាជាការប្រសើរឡើងយ៉ាងឆាប់រហ័សនេះគឺជាការប្រសើរឡើងយ៉ាងខ្លាំង។ ការធ្វើឱ្យប្រសើរឡើងប្រសិនបើមានប្រសិនបើមានប្រសិនបើមានប្រសិនបើមានប្រសិនបើមានប្រសិនបើមានប្រសិនបើមានប្រសិនបើមានប្រសិនបើមានប្រសិនបើមានប្រសិនបើមានប្រសិនបើមានប្រសិនបើមានប្រសិនបើមានប្រសិនបើមានប្រសិនបើមានប្រសិនបើមានប្រសិនបើមានប្រសិនបើមានប្រសិនបើមានប្រសិនបើមានប្រសិនបើមានប្រសិនបើមានប្រសិនបើមានប្រសិនបើមានប្រសិនបើមានប្រ ពិនិត្យឡើងវិញនិងធ្វើឱ្យប្រសើរឡើងប្រព័ន្ធប្រតិបត្តិការអេក្រង់អេក្រង់អេក្រង់អេក្រង់អេក្រង់អេក្រង់។គោលបំណងកំណត់គោលបំណងកំណត់គោលបំណង បន្ទាប់ពីធ្វើការនៅ HackerNoon ក្នុងរយៈពេលជាង 4 ឆ្នាំខ្ញុំមានអារម្មណ៍ថា reignited មានការកើនឡើងទៅក្នុងមូលដ្ឋានកូដរបស់យើងបន្ទាប់មក។ Tailwind បានធ្វើឱ្យការសាងសង់ងាយស្រួលហើយបន្ទាប់មក។ វាគឺជាការសាងសង់ស្អាតនិងមានប្រសិទ្ធិភាព - ហើយខ្ញុំមានអារម្មណ៍ថានឹងរក្សាទុកការផ្លាស់ប្តូរទៅមុខ។ តើអ្នកដឹងទេ? ទោះជាយ៉ាងណាក៏ដោយប្រសិនបើឆាប់រហ័សយើងនឹងបាត់បន្ថយ ការផ្លាស់ប្តូរទៅ Tailwind CSS មិនគឺគ្រាន់តែអំពីការផ្លាស់ប្តូរសៀវភៅរចនាសម្ព័ន្ធ - វាគឺអំពីការកសាងកាយប្រព័ន្ធប្រតិបត្តិការ frontend របស់យើង, ការអនុម័តភាពនិងការប្រសើរឡើងវិញការអភិវឌ្ឍ។ ខណៈពេលដែល Styled Components បានជួយរចនាសម្ព័ន្ធអ៊ីនធឺណិតរបស់ HackerNoon ក្នុងអំឡុងពេលអភិវឌ្ឍន៍សំខាន់, Tailwind បានផ្តល់ឱ្យយើងនូវភាពងាយស្រួល, ល្បឿននិងការរក្សាសម្ព័ន្ធដែលយើងត្រូវការនៅពេលដែលយើងដំណើរការ។ វាគឺជាការធ្វើការនៅពេលនេះ—កម្មវិធីរបស់យើងនៅតែមានច្រើននៃឧបករណ៍ Styled—ប៉ុន្តែមើល Tailwind រស់នៅលើគេហទំព័ររបស់យើងនិងនៅក្នុងឧបករណ៍ refactored ថ្មីនេះគឺជាការពេញនិយមដ៏អស្ចារ្យ។ ការពិតដែលខ្ញុំអាចបំពាក់ AI ជាមួយជំនាញរបស់ខ្ញុំដើម្បី refactor លឿនជាងនេះបានធ្វើឱ្យការផ្លាស់ប្តូរនេះមិនត្រឹមតែអាចធ្វើបានប៉ុន្តែមានអារម្មណ៍។ HackerNoon មានការអភិវឌ្ឍនិងប្រភេទរបស់យើងមានការអភិវឌ្ឍជាមួយនឹងវា។ ផ្នែកមួយក្នុងមួយពេល។
ហេតុអ្វីដែល HackerNoon បានប្រើសម្រាប់ផ្នែកផ្នែក Styled ។
What made us consider switching to Tailwind?
របៀបដែលខ្ញុំបានធ្វើការផ្លាស់ប្តូរ
preflight: false in the tailwind.config.js file. That move disabled most of Tailwind’s base resets, which brought back some order. សាកល្បង, there were still minor styling issues to fix, but things looked less like a war zone.preflight: falsetailwind.config.jsកាត់បន្ថយទំហំទូលំទូលំទូលំទូលំទូលំទូលំទូលំទូលំទូលំទូលំទូលំទូលំទូលំទូលំទូលំ
What the Migration Looks Like So Far
styled-components ពី package.json របស់យើងសម្រាប់ការល្អ។ 😉styled-componentspackage.json
គំនិតច្នៃប្រឌិតច្នៃប្រឌិត
