Minimalize Modern React Boilerplate (Easy To Customize)

Berikut adalah React Boilerplate yang sudah siap pakai untuk Production atau Development yang sudah terintegrasi dengan beberapa tools Front-End populer khususnya untuk React Developer dan bisa di customisasi sesuai dengan selera masing - masing bagi siapa saja yang mau menggunakannya, dikarenakan dari masing - masing orang mungkin ingin mempunyai standar customisasi nya sendiri sesuai dengan keinginannya masing - masing, demo mini project menggunakan React CSA Boilerplate.

Run Application

• Development Mode - npm run s
• Production Build - npm run b
• Production Build & Analyzer Bundle - npm run ba
• Testing React Component - npm run t

Features

• Support REACT HMR & CSS HMR
• Support Proggresive Web Apps (PWA) For Production
• Support SASS Preprocessor CSS
• Support Dynamic Import & Code Splitting
• Support Linting JavaScript & CSS
• Support .env File
• Support Manual Proxy Like CRA
• Support GraphQL
• Support Friendly Error
• Support Styled Components & Another CSS Library In JS
• Support Unit Test Jest & Enzyme
• And More

Build Include Technology

• React
• Webpack
• Babel
• Workbox
• Eslint
• Prettier
• Stylelint
• Postcss
• Jest
• Enzyme
• Any More

TIPS (Menyajikan file content yang di compress)

• install express-static-gzip
• kemudian tambahkan code seperti ini di Back-End Server anda.

if (process.env.NODE_ENV === 'production') {
  app.use(express.static(resolve(process.cwd(), 'client/build')))

  app.use(
    '*',
    staticGzip(resolve(process.cwd(), 'client/build/static/js'), {
      enableBrotli: true
    })
  )

  app.get('*', (req, res) => {
    res.sendFile(resolve(process.cwd(), 'client/build/index.html'))
  })
}

• atau dengan menambahkan custom content header middleware (optional)

Author

• Restu Wahyu Saputra

LICENSE

• MIT