Skip to content

minimalize modern react boilerplate created using webpack 4 include technology pwa and include popular tools for react developer

License

Notifications You must be signed in to change notification settings

restuwahyu13/react-boilerplate

Repository files navigation

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.

logo-react

logo-react

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'))
  })
}

Global Method TDD Unit Test

  • shallow
  • mount
  • render
  • renderer
  • renderHook
  • act
  • addClear
  • cleanup
  • createSerializer
  • toJson

Author

LICENSE