All Projects → javascript-indonesias → ExpressSimpleBoilerPlate

javascript-indonesias / ExpressSimpleBoilerPlate

Licence: other
Kerangka project Express JS dengan tambahan ES2015, ESLint, Webpack, Babel, beberapa middleware pengaman, Worker Threads, mock data generator, dan masih banyak lagi.

Programming Languages

javascript
184084 projects - #8 most used programming language

Projects that are alternatives of or similar to ExpressSimpleBoilerPlate

starbase
⭐ Production-ready website boilerplate made with webpack 5, modern JS (via Babel 7) & Sass
Stars: ✭ 70 (+218.18%)
Mutual labels:  eslint, boilerplate-template
webpack-typescript-react
Webpack 5 boilerplate with support of most common loaders and modules (see tags and description)
Stars: ✭ 185 (+740.91%)
Mutual labels:  eslint, boilerplate-template
Html Sass Babel Webpack Boilerplate
Webpack 4 + Babel + ES6 + SASS + HTML Modules + Livereload
Stars: ✭ 35 (+59.09%)
Mutual labels:  eslint, boilerplate-template
xd-plugin-boilerplate
A boilerplate for plugins for Adobe XD CC including preconfigured linting, autocompletion and Webpack for bundling
Stars: ✭ 25 (+13.64%)
Mutual labels:  eslint, boilerplate-template
awesome-vue-boilerplate
😍 Awesome Vue Boilerplate 🥳 Vue 🥰 Vuex, vuex-pathify 🤗 element-ui 🤲 tailwindcss
Stars: ✭ 60 (+172.73%)
Mutual labels:  eslint, boilerplate-template
reactjs-vite-tailwindcss-boilerplate
ReactJS + Vite boilerplate to be used with Tailwindcss.
Stars: ✭ 103 (+368.18%)
Mutual labels:  eslint
collections
📝 Collections library made in TypeScript
Stars: ✭ 14 (-36.36%)
Mutual labels:  eslint
tailwind-react-next.js-typescript-eslint-jest-starter
Starter template for building a project using React, Typescript, Next.js, Jest, TailwindCSS and ESLint.
Stars: ✭ 80 (+263.64%)
Mutual labels:  eslint
generator-bunny
🐰 Jumpstart node module, like a bunny!
Stars: ✭ 13 (-40.91%)
Mutual labels:  eslint
sparrowx
Minimal, SEO-friendly, Jekyll + Netlify CMS Boilerplate.
Stars: ✭ 15 (-31.82%)
Mutual labels:  boilerplate-template
react-redux-starter-kit
Get started with React, Redux, Webpack and eslint
Stars: ✭ 29 (+31.82%)
Mutual labels:  eslint
uno-game
🎴 An UNO Game made in Javascript
Stars: ✭ 93 (+322.73%)
Mutual labels:  eslint
eslint-plugin-editorconfig
An ESLint plugin to enforce EditorConfig rules
Stars: ✭ 22 (+0%)
Mutual labels:  eslint
DiscordBot-Template
A boilerplate / template for discord.js bots with 100% coverage of Discord API, command handler, error handler based on https://discordjs.guide/
Stars: ✭ 129 (+486.36%)
Mutual labels:  boilerplate-template
web-build-tool-demo
比较全面的前端构建工具demo,拿来即练,不定时更新,包含git npm gulp webpack babel typescript husky eslint tslint lint-stage prettier等
Stars: ✭ 42 (+90.91%)
Mutual labels:  eslint
typescript-nuxtjs-boilerplate
🍱 Nuxt.js with TypeScript and Run with docker and docker-compose 🐶🦄🔥 visit: https://typescript-nuxtjs-boilerplate.netlify.com/example
Stars: ✭ 51 (+131.82%)
Mutual labels:  eslint
react-simple-boilerplate
Simple React Boilerplate with Webpack, Github Actions, Scss, Lazy Loading etc....
Stars: ✭ 38 (+72.73%)
Mutual labels:  eslint
eslint-plugin-disable
Disable ESLint plugins using file path patterns and inline comments
Stars: ✭ 51 (+131.82%)
Mutual labels:  eslint
vue-template
🎉 一个集成了 webpack + vue-loader + vuex + axios 的自定义 vue-cli 模板,其中包含 webpack 热更新,linting,测试以及 css 处理器等内容
Stars: ✭ 25 (+13.64%)
Mutual labels:  eslint
analysis-model
A library to read static analysis reports into a Java object model
Stars: ✭ 74 (+236.36%)
Mutual labels:  eslint

Node JS Express Boilerplate ES2015++

Kerangka aplikasi (boilerplate) untuk aplikasi backend REST API berbasis Node JS dengan framework Express JS, Babel, dan ES2015. Dibuat berdasarkan referensi Kent C. Dodds Blogs yang berjudul How I structure Express apps dan Coding Garden with CJ Node JS. Kerangka dengan tambahan Linter ESLint dan Prettier Formatter, bundle aplikasi dengan melakukan Webpack, CRUD sederhana dengan MongoDB, Winston Logger, mock data dengan Faker JS, dan contoh penggunaan Worker Thread untuk proses komputasi data yang berat di thread terpisah Node JS.

Github sumber dari Kent C Dodds adalah disini https://github.com/kentcdodds/express-app-example.

Gthub sumber dari Coding Garden with CJ dapat dilihat disini https://github.com/CodingGarden/mars-weather-api

Instalasi

Silahkan lakukan clone project ini dengan cara mengunduh dari menu Code > Zip di halaman Github ini. Atau lakukan dengan melakukan Git Clone project dengan perintah :

git clone -b master -o github --depth 1 --single-branch https://github.com/javascript-indonesias/ExpressSimpleBoilerPlate.git

Setelah melakukan clone project atau download project kerangka ini, jalankan perintah npm install di dalam folder project tersebut.

Penggunaan Development dan Debug

Pastikan di komputer anda telah terpasang Node JS versi 12.x atau yang lebih baru. Clone atau download project ini dengan menggunakan Git ke komputer lokal.

  • Kemudian jalankan Perintah npm install .
  • Untuk menjalankan proses debug atau development, jalankan perintah npm run start-babel. Di dalam folder /src/index.js terdapat fungsi melakukan Clustering proses Node JS. Non aktifkan atau berikan comment // pada fungsi clustering tersebut, jika proses Clustering membuat perangkat dan proses development terasa berat, atau tidak dibutuhkan ketika proses development.

Penggunaan Production

Dalam pembuatan mode production, terdapat dua pilihan. Pilihan pertama yaitu melakukan build dengan Babel Compiler, dan pilihan kedua melakukan build dengan Webpack.

Production dengan Babel Compiler

  • Untuk proses Production dengan Babel Compiler , jalankan perintah npm run build-babel . Hasil dari build akan menghasilkan folder /dist .

  • Untuk menguji hasil build di folder /dist , jalankan perintah npm run start-babel .

  • Jika ingin deploy ke server, gunakan hasil build di folder /dist tersebut. Jangan lupa untuk konfigurasi .env dan instalasi package yang dibutuhkan di package.json .

Production dengan Webpack

  • Jalankan perintah npm run build-prod untuk membuat bundle file project yang ada di folder /src menjadi satu bundle file JavaScript yang sudah di minify.

  • Hasil build mode Webpack akan menghasilkan file-file yang terdapat di folder /bundle.

  • Untuk menguji hasil build mode Webpack ini, jalankan perintah npm run debug-prod.

  • Jika ingin digunakan untuk deploy ke server, gunakan hasil build di folder /bundle ini. Jangan lupa untuk konfigurasi .env dan instalasi package yang dibutuhkan di package.json . Setelah konfigurasi dua hal tersebut, jalankan file server.bundle.js dengan PM2, Nodemon, atau Forever JS.

Persyaratan Opsional Lainnya

Pastikan plugin ESLint dan Prettier telah terpasang di VS Code. Kemudian tambahkan konfigurasi ini di dalam file settings.json di setelan milik VS Code. File konfigurasi dapat diakses dengan menu File > Preferences > Settings. Kemudian klik tanda tombol di pojok kanan atas yang bertuliskan Open Settings (JSON).

"editor.formatOnSave": true,
"[javascript]": {
    "editor.defaultFormatter": "esbenp.prettier-vscode"
},
"[typescript]": {
    "editor.defaultFormatter": "esbenp.prettier-vscode"
},
"editor.codeActionsOnSave": {
    "source.fixAll.eslint": true
}

Dengan penambahan baris konfigurasi VS Code di atas, VS Code akan melakukan formatting kode JavaScript ketika melakukan penyimpanan. Dan jangan lupa, pemrograman dengan VS Code semakin seru dengan menggunakan Mayukai Theme dan Iosevka Mayukai Font. Selamat mencoba.

Note that the project description data, including the texts, logos, images, and/or trademarks, for each open source project belongs to its rightful owner. If you wish to add or remove any projects, please contact us at [email protected].