เรียนรู้ว่าการแบ่งปันโค้ดและการทำงานร่วมกันทำได้ง่ายเพียงใด ด้วยแนวทางที่ใช้งานง่ายของ Bit ในการนำส่วนประกอบ React ที่นำมาใช้ซ้ำได้

ยินดีต้อนรับสู่อนาคตที่ส่วนประกอบของ React เป็นส่วนประกอบสำคัญของเว็บ!

ในปี 2023 การใช้ซ้ำและแบ่งปันส่วนประกอบเหล่านี้มีความสำคัญมากกว่าที่เคย ด้วยเทคโนโลยีและเฟรมเวิร์กใหม่ๆ ที่เกิดขึ้นทุกวัน (ขอบคุณ JavaScript!) การมีระบบเพื่อจัดการและกระจายส่วนประกอบของคุณอย่างมีประสิทธิภาพจึงเป็นสิ่งสำคัญ

ในบทความนี้ ฉันจะแสดงเครื่องมือที่ยอดเยี่ยมที่จะช่วยให้คุณสร้าง ใช้ซ้ำ และแชร์ส่วนประกอบ React เพียงอย่างเดียวหรือเป็นส่วนหนึ่งของความพยายามของทีม

ดังนั้น เรามาเจาะลึกและเรียนรู้วิธีสร้างให้ดียิ่งขึ้นไปพร้อมๆ กัน!

ขอแนะนำบิต

Bit จะเป็นเครื่องมือที่จะตอบทุกคำถามของคุณสำหรับบทความนี้

  • คุณจะแบ่งปันส่วนประกอบ React กับผู้อื่นได้อย่างไร? นิดหน่อย
  • คุณจะนำส่วนประกอบ React จากผู้อื่นในแอปของคุณกลับมาใช้ซ้ำได้อย่างง่ายดายได้อย่างไร นิดหน่อย

และยังจะตอบคำถามบางข้อที่คุณยังคิดไม่ถึง เช่น:

  • ฉันจะจัดการการกำหนดเวอร์ชันส่วนประกอบของฉันได้อย่างไร ด้วย Bit คุณทำได้!
  • ฉันจะให้สิทธิ์การเข้าถึงแก่ผู้อื่นเพื่อให้พวกเขาสามารถสนับสนุนโค้ดของตนเองในส่วนประกอบของฉันได้อย่างไร ด้วย Bit คุณทำได้!

ฉันหมายถึงว่าแน่นอนว่าเครื่องมืออื่นๆ จะช่วยให้คุณทำสิ่งเหล่านั้นทีละอย่างได้ แต่มีไม่มากนักที่ทำได้จริงทั้งหมด

Bit เป็นแพลตฟอร์มที่ช่วยให้คุณสร้าง ใช้ซ้ำ และแบ่งปันส่วนประกอบที่เขียนได้เป็นโค้ดโมดูลาร์ที่สามารถนำมาใช้ซ้ำได้อย่างง่ายดายทั่วทั้งโครงการและทีม Bit ช่วยปรับปรุงกระบวนการพัฒนาโดยการมอบคุณสมบัติต่างๆ เช่น การควบคุมเวอร์ชัน เครื่องมือการทำงานร่วมกัน และการจัดการแพ็คเกจ ทำให้นักพัฒนาสามารถทำงานร่วมกันได้ง่ายขึ้นและสร้างซอฟต์แวร์ที่ดีกว่าได้เร็วขึ้น

ค้นหาข้อมูลเพิ่มเติมได้ที่นี่:



โดยรวมแล้ว Bit มอบวิธีที่มีประสิทธิภาพและปรับขนาดได้ในการจัดการและแบ่งปันส่วนประกอบ ช่วยให้ทีมมุ่งเน้นไปที่การสร้างซอฟต์แวร์ที่เป็นนวัตกรรมและมีคุณภาพสูง

ในบทความนี้ ฉันจะใช้ Bit เพื่อแสดงให้คุณเห็นว่าคุณสามารถใช้ซ้ำและแบ่งปันส่วนประกอบของคุณกับผู้อื่นได้อย่างไร

การตั้งค่า

ก่อนที่จะก้าวไปข้างหน้า มาติดตั้ง Bit กันก่อน:

npx @teambit/bvm install

เพียงเท่านี้ คุณได้ติดตั้ง Bit แล้ว ยินดีด้วย!

หากคุณประสบปัญหากับวิธีนี้ โปรดดู "เอกสารประกอบ" เพื่อดูรายละเอียดเพิ่มเติม

การใช้ส่วนประกอบ React ซ้ำด้วย Bit

สมมติว่าคุณมีแอปที่ใช้งานได้และต้องการเพิ่มส่วนประกอบที่สร้างไว้ล่วงหน้าที่คุณพบขณะเรียกดูไซต์ "Bit.cloud"

ฉันจะเลือก "อันนี้" ซึ่งเป็นส่วนหัวที่ดีที่เพิ่มไอคอนถัดจากเนื้อหาของส่วนหัว

นี่คือลักษณะขององค์ประกอบเมื่อแสดงผล:

อย่างไรก็ตาม คุณสามารถเปลี่ยนโค้ดทางด้านซ้ายได้อย่างง่ายดาย และมันจะอัปเดตผลลัพธ์ทางด้านขวา

มาเพิ่มลงในโปรเจ็กต์ Next.js ที่ฉันทำงานอยู่แล้ว โปรเจ็กต์นี้เป็นเว็บไซต์แบบคงที่ขั้นพื้นฐานที่แสดงหน้าแรกเดียว ไม่มีอะไรพิเศษ แต่ฉันต้องการให้ส่วนหัวมีไอคอนที่สวยงาม ดังนั้นมาติดตั้งส่วนประกอบของเรากันดีกว่า

คุณสามารถใช้ Yarn หรือ NPM เพื่อทำสิ่งนี้ได้ แต่เนื่องจากเรากำลังพูดถึง Bit เรามาลองใช้มันกันดีกว่า

ขั้นแรก เราต้องเริ่มต้นพื้นที่ทำงาน ไม่เช่นนั้น Bit CLI จะไม่อนุญาตให้คุณติดตั้งสิ่งใด:

bit init

และนั่นก็คือ ตอนนี้คุณพร้อมที่จะเริ่มการติดตั้งส่วนประกอบแล้ว

ซึ่งคุณสามารถทำได้ด้วย:

bit install @semantic-org/semantic-ui-react.header

ดังนั้นคุณควรเห็นสิ่งนี้:

  Resolving component dependencies for workspace: 'my-workspace-name'
✔ importing components
  installing dependencies in workspace using teambit.dependencies/pnpm
✔ deduping dependencies for installation
✔ linking components
✔ running pre install subscribers
 WARN  Moving react-dom that was installed by a different package manager to "node_modules/.ignored
 WARN  Moving react that was installed by a different package manager to "node_modules/.ignored
 WARN  Moving next that was installed by a different package manager to "node_modules/.ignored
 WARN  Moving eslint-config-next that was installed by a different package manager to "node_modules/.ignored
 WARN  Moving eslint that was installed by a different package manager to "node_modules/.ignored
 WARN  1 other warnings
Downloading registry.npmjs.org/next/13.1.6: 9.59 MB/9.59 MB, done
Downloading registry.npmjs.org/@next/swc-darwin-arm64/13.1.6: 26.4 MB/26.4 MB, done
Already up to date
Packages are hard linked from the content-addressable store to the virtual store.
  Content-addressable store is at: /Users/fernandodoglio/.pnpm-store/v3
  Virtual store is at:             node_modules/.pnpm
Progress: resolved 307, reused 55, downloaded 240, added 295, done

dependencies:
+ @bit/semantic-org.semantic-ui-react.header 0.88.2
+ @next/font 13.1.6 (13.2.3 is available)
+ eslint 8.34.0 (8.35.0 is available)
+ eslint-config-next 13.1.6 (13.2.3 is available)
+ next 13.1.6 (13.2.3 is available)
+ react 18.2.0
+ react-dom 18.2.0
  -------------------------
✔ installing dependencies using pnpm
✔ running post install subscribers
✔ linking components
✔ deduping dependencies for installation
Successfully resolved dependencies for 0 component(s) in 23.294 seconds

หลังจากติดตั้งส่วนประกอบแล้ว คุณจะใช้งานได้อย่างไร? ง่าย! เช่นเดียวกับที่คุณทำกับแพ็คเกจภายนอก แบบนี้:

import Header from '@bit/semantic-org.semantic-ui-react.header'

const style = <link rel='stylesheet' href='https://cdn.jsdelivr.net/npm/[email protected]/dist/semantic.min.css'/>

const HeaderExampleIconProp = () => <Header as='h2' icon='plug' content='Welcome to the main site' />

คุณมีคำสั่ง import อยู่ที่นั่น ซึ่งเป็นสิ่งที่คุณสนใจ ส่วนที่เหลือเป็นเพียงการแสดงให้คุณเห็นว่าส่วนประกอบสามารถใช้งานได้อย่างไร คุณสามารถดูได้ในภาพหน้าจอด้านล่างที่ฉันเพิ่มสไตล์ใหม่และส่วนประกอบใหม่ ส่วนที่เหลือเป็นโค้ดที่มีอยู่:

ดังที่คุณเห็นกระบวนการใช้ส่วนประกอบจากพื้นที่เก็บข้อมูลกลาง Bit นั้นเรียบง่ายเล็กน้อย

ตอนนี้เรามาดูกันว่าเราจะแบ่งปันส่วนประกอบของเราเองได้อย่างไรโดยการเพิ่มส่วนประกอบที่กำหนดเองใหม่ลงในโค้ด จากนั้นแยกออกมาและแบ่งปันกับโลก

คุณชอบสิ่งที่คุณอ่านหรือไม่? ลองสมัครรับจดหมายข่าวฟรีของฉัน ซึ่งฉันจะแบ่งปันภูมิปัญญาอันทรงคุณค่าในอุตสาหกรรมไอทีตลอด 2 ทศวรรษของฉันกับทุกคน เข้าร่วม “ความเร้าใจของนักพัฒนาเก่า” !

การสร้างส่วนประกอบของคุณเองด้วย Bit

เอาล่ะ ตอนนี้เราจะทำสิ่งที่ตรงกันข้าม แทนที่จะดึงบางอย่างจาก repo ส่วนประกอบส่วนกลาง เราจะสร้างอันใหม่ขึ้นมาแล้วเราจะผลักมันไปที่ Bit.cloud

เหล่านี้จะเป็นขั้นตอน:

  1. เราจะสร้าง ขอบเขต บน Bit.cloud โดยที่ส่วนประกอบของเราจะถูกจัดกลุ่ม
  2. เราจะใช้คำสั่ง bit create เพื่อสร้างเทมเพลตสำหรับส่วนประกอบใหม่
  3. จากนั้นเราจะอัปเดตเทมเพลตด้วยโค้ดของส่วนประกอบจริงต่อไป
  4. จากนั้นเราจะแท็กโค้ดเป็นเวอร์ชันแรก
  5. เราจะเผยแพร่รหัส
  6. และสุดท้าย เราจะติดตั้งและนำส่วนประกอบของเราเองไปใช้ซ้ำในโครงการอื่นเพื่อเป็นโบนัสเพิ่มเติม

เรามาเริ่มกันเลย

1. การสร้างขอบเขต

ขอบเขตคือ "กลุ่ม" ที่คุณสามารถใส่ส่วนประกอบต่างๆ เข้าไปได้ ในกรณีของเรา เราจะไปที่ "Bit.cloud" (ฉันสมมติว่าคุณมีบัญชีอยู่แล้วที่นี่ ไม่อย่างนั้นก็ดำเนินการต่อและ "ลงทะเบียน")

คลิกที่ปุ่ม "ใหม่" ที่มุมขวาบน จากนั้นเลือกตัวเลือก "ขอบเขต"

สิ่งนี้จะนำคุณไปสู่หน้า "ขอบเขตใหม่":

ที่นี่ฉันได้ตั้งค่าของฉันเป็นขอบเขตสาธารณะส่วนบุคคลโดยใช้ชื่อว่า "การ์ด" คุณสามารถเลือกสิ่งที่คุณต้องการได้ เพียงจดชื่อผู้ใช้ (หรือชื่อองค์กร หากคุณเลือก "ทีม") และชื่อขอบเขต คุณจะต้องใช้มันภายในไม่กี่นาที ในที่สุดคลิกที่ "สร้าง"

เมื่อขอบเขตพร้อมแล้ว ให้ไปที่ไฟล์ workspace.jsonc ของคุณ (ควรอยู่ที่รากของโปรเจ็กต์ของคุณ) อัปเดตคีย์ defaultScope เป็นชื่อขอบเขตของคุณ

2. การสร้างส่วนประกอบ

ตอนนี้เราพร้อมที่จะสร้างส่วนประกอบของเราแล้ว เราจะดำเนินการดังกล่าวด้วยคำสั่ง bit create คำสั่งนี้น่าสนใจมากเพราะใช้งานได้กับเทมเพลต เราจะใช้เทมเพลต React แต่คุณมีหลายแบบให้เลือก (หรือสร้างเทมเพลตของคุณเอง) คลิก ที่นี่ หากคุณต้องการทราบข้อมูลเพิ่มเติมเกี่ยวกับคำสั่งนี้

ส่วนประกอบที่เราจะสร้างนั้นเป็นส่วนประกอบของการ์ดอย่างง่าย ส่วนประกอบที่สามารถเก็บส่วนประกอบไว้ข้างในได้มากขึ้น และจะสร้างภาพห่อหุ้มที่สวยงามรอบๆ ส่วนประกอบเหล่านั้น

นี่คือคำสั่งที่คุณต้องการ:

bit create react ui/cards --scope=deleteman.card

นี่คือความหมายทั้งหมด:

  • ส่วน "ตอบสนอง" คือเทมเพลต คุณสามารถระบุสิ่งอื่นๆ เช่น HTML, MDX หรือแม้แต่ React Native ได้
  • ส่วน “ui/cards” คือโฟลเดอร์ที่จะสร้างส่วนประกอบของเรา คุณสามารถดูรากของโครงการของคุณได้ คุณควรเห็นโฟลเดอร์ชื่อ “‹ขอบเขต›” (ในกรณีของเราคือ “การ์ด”) ข้างในนั้นมีโฟลเดอร์ชื่อ “ui” และภายในนั้นจะมีอีกโฟลเดอร์หนึ่งเรียกว่า “การ์ด” นี่คือที่ที่เราจะทำงานในอีกสักครู่
  • สุดท้าย ส่วน “ — scope=deleteman.card” คือขอบเขตที่ระบุ ด้วยวิธีนี้เมื่อเราเผยแพร่ส่วนประกอบ Bit จะรู้ว่าจะวางไว้ที่ไหน

3. การอัปเดตโค้ดเทมเพลต

โครงสร้างโฟลเดอร์สำหรับส่วนประกอบที่สร้างขึ้นใหม่มีลักษณะดังนี้:

ตามค่าเริ่มต้น Bit ได้สร้างไฟล์หลายไฟล์ รวมถึง card.docs.mdx , card.composition.tsx(นี่คือที่ที่คุณจะเพิ่มตัวอย่างที่แสดงวิธีใช้ส่วนประกอบของคุณ) และ card.spec.tsx พวกเขาทั้งหมดมีเนื้อหาทั่วไปอยู่ข้างใน หน้าที่ของคุณคือเขียนเอกสารและการทดสอบจริง

สำหรับวัตถุประสงค์ของบทความนี้ เราจะมาเน้นที่ไฟล์ card.tsx:

import styles from './card.module.css'

export function Card({children}) {

  return (
      <div className={styles.my_card}>
          {children}
      </div>
  )
}

อย่างที่คุณเห็น ไม่มีอะไรพิเศษเกี่ยวกับมัน มันเป็นองค์ประกอบที่เรียบง่ายและทั่วไป นอกจากนี้ยังนำเข้าสไตล์จากไฟล์ card.module.css ในเครื่องด้วย

4. การแท็กโค้ด

เมื่อโค้ดพร้อมแล้ว ตอนนี้เราต้องคิดที่จะเผยแพร่มันออกไปสู่โลกกว้าง

ก่อนที่จะดำเนินการดังกล่าว ตรวจสอบให้แน่ใจว่าไม่มีการขึ้นต่อกันที่ขาดหายไปด้วยคำสั่ง bit status หากมีสิ่งผิดปกติกับส่วนประกอบของคุณ โปรดแก้ไขก่อนดำเนินการต่อ

หากคุณได้รับผลลัพธ์เช่นนี้ คุณก็พร้อมที่จะดำเนินการต่อ:

ตอนนี้เราต้อง "ติดแท็ก" ส่วนประกอบของเรา ซึ่งจะเทียบเท่ากับการรัน git add และ git commit ด้วยกัน

ดังนั้นด้วยบรรทัดต่อไปนี้ เราสามารถสร้างเวอร์ชัน 1.0.0 สำหรับส่วนประกอบของเราได้:

bit tag deleteman.cards/ui/[email protected]

ผลลัพธ์จะเป็นแบบละเอียดมาก แต่ถ้าในตอนท้าย คุณเห็นบรรทัดเหล่านี้ หมายความว่าคุณทำงานได้แล้ว:

new components
(first version for components)
     > ui/[email protected]

💡 หมายเหตุ: ด้วย Bit คุณยังสามารถ เปรียบเทียบสองเวอร์ชันส่วนประกอบ ซึ่งจะทำให้คุณเห็นภาพรวมของการเปลี่ยนแปลงทั้งหมดในเวอร์ชันต่างๆ เรียนรู้เพิ่มเติม ที่นี่

5. การเผยแพร่ส่วนประกอบ

ขั้นตอนถัดไปของกระบวนการนี้ที่จะช่วยให้คุณแบ่งปันส่วนประกอบที่ใช้ซ้ำได้คือการอัปโหลดไปยัง Bit.cloud

หากคุณติดตามมาจนถึงตอนนี้ มันควรจะง่ายเหมือนการเขียน:

bit export

แค่นั้นแหละ! ฉันรู้ใช่ไหม!

หากทุกอย่างเป็นไปตามแผน คุณจะเห็นผลลัพธ์ที่คล้ายกับสิ่งนี้:

และถ้าคุณไปที่ Bit.cloud คุณจะเห็นคอมโพเนนต์ทำงานอยู่ดังนี้:

นั่นคือส่วนประกอบของเราและทุกคนก็พร้อมที่จะใช้!

💡 คุณสามารถเรียนรู้เพิ่มเติมเกี่ยวกับการแยกและการนำส่วนประกอบที่มีอยู่แล้วกลับมาใช้ใหม่ได้ที่นี่»

6. นำส่วนประกอบของเราเองกลับมาใช้ใหม่

สำหรับตัวอย่างเชิงปฏิบัติในการค้นหาส่วนประกอบที่ถูกต้องและวิธีใช้งาน เรามาลองค้นหาส่วนประกอบของเราเองใน Bit.cloud จากนั้นหาคำตอบว่าเราจะเพิ่มส่วนประกอบดังกล่าวลงในโปรเจ็กต์ใหม่ได้อย่างไร

ไปที่ Bit.cloud และที่แถบค้นหาด้านบน ให้ป้อนคำว่า "card" คุณควรเห็นสิ่งที่คล้ายกับสิ่งนี้:

องค์ประกอบที่ตรงกันของคุณจะปรากฏก่อน แต่คุณควรจะเห็นองค์ประกอบของฉันด้วยหากคุณเรียกดูผลลัพธ์จากชุมชน

ฉันจะเลือก "ส่วนประกอบของฉัน" ซึ่งหมายความว่าฉันควรเห็นสิ่งนี้:

เอกสาร จะแสดงวิธีใช้งานให้คุณดู และยังมีสนามเด็กเล่นแสดงสด (ภายใต้ชื่อ “Render hello world!”) ซึ่งคุณสามารถแก้ไขได้เพื่อดูผลลัพธ์แบบสดทางด้านขวา

ตอนนี้เพื่อใช้งานเรามีหลายตัวเลือก หากคุณคลิกที่ปุ่ม "ใช้" ที่ด้านบนขวา คุณจะเห็น:

คุณสามารถใช้ Bit เองเพื่อติดตั้งหรือนำเข้ามัน (เพิ่มเติมในไม่กี่วินาที) คุณยังสามารถใช้ NPM, Yarn หรือแม้แต่ PNPM คุณจะได้รับข้อมูลทั้งหมดที่คุณต้องการหากคุณคลิกที่แท็บของแต่ละตัวเลือก

สำหรับตัวอย่างนี้ ฉันจะยึด Bit เป็นหลัก แต่ฉันได้แสดงให้คุณเห็นถึงวิธีการ "ติดตั้ง" ส่วนประกอบแล้ว ดังนั้น ฉันจะ "นำเข้า" ส่วนประกอบดังกล่าวไปยังโปรเจ็กต์ใหม่แทน ข้อแตกต่างคือเมื่อคุณติดตั้ง คุณจะดาวน์โหลดการขึ้นต่อกันและพร้อมให้คุณใช้เหมือนกับแพ็คเกจ NPM อื่นๆ แต่ไม่มีอะไรอื่นอีก

อย่างไรก็ตาม เมื่อคุณ "นำเข้า" มันจะถูกคัดลอกไปยังรูทของโปรเจ็กต์ของคุณ Symlink ถูกสร้างขึ้นภายใน node_modules ดังนั้นคุณจึงสามารถใช้งานได้เหมือนกับแพ็คเกจ NPM ปกติ แต่ตอนนี้คุณสามารถเข้าถึงโค้ดได้แล้ว

ดูสถานะของโปรเจ็กต์ของฉันเมื่อฉันนำเข้าส่วนประกอบการ์ด:

คุณสามารถดูซอร์สโค้ดที่แท้จริงของส่วนประกอบได้ นี่เป็นสิ่งใหม่โดยสิ้นเชิงเมื่อเทียบกับ DX เมื่อใช้ NPM หรือตัวจัดการแพ็คเกจอื่น ๆ ตอนนี้คุณสามารถอัปเดตโค้ดได้อย่างปลอดภัยหากคุณต้องการ (กี่ครั้งแล้วที่เราต้องการเปลี่ยนโค้ดของการขึ้นต่อกัน!) จากนั้นเผยแพร่เวอร์ชันใหม่ผ่าน Bit

คุณลักษณะนี้ยอดเยี่ยมมากเมื่อคุณต้องการทำงานร่วมกับทีมอื่นๆ ในองค์ประกอบข้ามโครงการต่างๆ ด้วยวิธีนี้ คุณสามารถทำการเปลี่ยนแปลงทั้งหมดที่คุณต้องการ ทดสอบภายในโปรเจ็กต์ที่คุณกำลังใช้ และเผยแพร่เวอร์ชันใหม่โดยไม่ต้องดำเนินการแก้ไขปัญหาเฉพาะหน้าใดๆ

และเพื่อพิสูจน์ประเด็นของฉัน นี่คือลักษณะการใช้แพ็คเกจที่นำเข้านี้จากโค้ด:

กล่าวอีกนัยหนึ่ง ไม่มีอะไรเปลี่ยนแปลง ฉันยังคงอ้างอิงมันเหมือนกับว่าฉันจะทำมันถ้าฉันติดตั้งผ่าน NPM หรือตัวเลือกอื่น ๆ !

และนั่นคือวิธีที่คุณทำ

ความสำเร็จ!

ไม่ว่าคุณจะชอบหรือไม่ก็ตาม React มีอยู่ในเกือบทุกที่บนเว็บ คุณจะพบกับมันไม่ช้าก็เร็ว ไม่ว่าคุณกำลังสร้างบางสิ่งด้วย Next หรือ Remix หรือหากคุณแค่สร้างไซต์คงที่ด้วย Astro มีโอกาสที่คุณจะโดนหัวชนกับมัน

อย่างไรก็ตาม การสร้าง แบ่งปัน และนำส่วนประกอบกลับมาใช้ใหม่ไม่จำเป็นต้องเป็นเรื่องที่ยุ่งยาก จริงๆ แล้วสามารถเพลิดเพลินได้!

ต้องขอบคุณ Bit ที่ทำให้คุณสามารถแบ่งปันงานของคุณกับผู้อื่นหรือใช้ของคนอื่นด้วยคำสั่งเดียวได้อย่างรวดเร็ว

ลองดู

สร้างแอป React ด้วยส่วนประกอบที่นำมาใช้ซ้ำได้ เช่นเดียวกับ Lego

เครื่องมือโอเพ่นซอร์สของ Bitช่วยเหลือนักพัฒนากว่า 250,000 คนในการสร้างแอปด้วยส่วนประกอบ

เปลี่ยน UI คุณลักษณะ หรือหน้าใดๆ ให้เป็นส่วนประกอบที่ใช้ซ้ำได้ — และแชร์ทั่วทั้งแอปพลิเคชันของคุณ การทำงานร่วมกันและสร้างเร็วขึ้นง่ายกว่า

เรียนรู้เพิ่มเติม

แบ่งแอปออกเป็นส่วนประกอบเพื่อให้การพัฒนาแอปง่ายขึ้น และเพลิดเพลินกับประสบการณ์ที่ดีที่สุดสำหรับเวิร์กโฟลว์ที่คุณต้องการ:

ไมโครฟรอนต์เอนด์

ระบบการออกแบบ

การแบ่งปันรหัสและการใช้ซ้ำ

โมโนเรโป

เรียนรู้เพิ่มเติม: