reforge

โซลูชัน UI แบบสำเร็จรูปสำหรับแอปพลิเคชันระดับองค์กรในรูปแบบ React ต้นแบบ

สาธิต · รายงานข้อผิดพลาด · คุณสมบัติคำขอ

คุณสมบัติ

• UI ที่หรูหราและปรับแต่งได้โดยใช้ Tailwindcss และ Ant Design
• แอปพลิเคชันหน้าเดียวโดยใช้ React Router
• จำลองคำขอ API โดยใช้ reqres
• เค้าโครงและตารางอันทรงพลังโดยใช้ @ant-design/pro-components
• การแยกโค้ดและส่วนประกอบการโหลดแบบ Lazy Loading โดยใช้ @loadable/component
• การจัดการสถานะโดยใช้ react-redux และ @reduxjs/toolkit
• สถานะ redux ถาวรโดยใช้ redux-persist
• กำลังโหลดแถบความคืบหน้าโดยใช้ nprogress
• เปิดใช้ ESLint และ Prettier แล้ว
• ตัวเลือกในการเปิดใช้งาน Progressive Web App (PWA) (มีเฉพาะในรุ่นที่ใช้งานจริงเท่านั้น)
• Axios Interceptor เปิดใช้งานเพื่อจัดการการอนุญาต API
• เวิร์กโฟลว์อัตโนมัติสำหรับการตรวจสอบคำขอดึงใหม่

สาธิต

https://reforge.netlify.app

ข้อมูลรับรอง

• อีเมล์: [email protected]
• รหัสผ่าน: password

การใช้งาน

• โคลนโครงการและเปลี่ยนไดเร็กทอรี

  git clone https://github.com/arifszn/reforge.git
  cd reforge

• ติดตั้งการพึ่งพา

  npm install

• เรียกใช้เซิร์ฟเวอร์ dev

  npm run dev

• สุดท้ายไปที่ http://localhost:5173 จากเบราว์เซอร์ของคุณ ข้อมูลรับรองสามารถพบได้ด้านบน

การกำหนดค่า

การตั้งค่าต่างๆ รวมถึงชื่อแอป สีของธีม เมตาแท็ก ฯลฯ สามารถควบคุมได้จาก config.ts ไฟล์เดียวที่อยู่ที่รากของโปรเจ็กต์

 //config.ts
const CONFIG = {
  appName : 'Reforge' ,
  enablePWA : true ,
  theme : {
    accentColor : '#818cf8' ,
    sidebarLayout : 'mix' ,
    showBreadcrumb : true ,
  } ,
  metaTags : {
    title : 'Reforge' ,
    description :
      'An out-of-box UI solution for enterprise applications as a React boilerplate.' ,
    imageURL : 'logo.svg' ,
  } ,
} ;

export default CONFIG ; 

สนับสนุน

คุณสามารถแสดงการสนับสนุนโดยนำแสดงโดยโปรเจ็กต์นี้

มีส่วนช่วย

หากต้องการบริจาค โปรดดูคู่มือการบริจาค

ใบอนุญาต

เอ็มไอที