Pengenalan Lingkungan Kerja Reactjs. Mahir Reactjs Dalam seminggu !

  • by

Pada postingan sebelumnya anda telah mempelajari tentang hal-hal umum pada reactjs, seperti fitur-fitur pada reactjs, keunggulan reactjs dan lain lain.

Kali ini kita akan membahas mengenai lingkungan kerja reactjs. lalu bagaimana kita memulai menggunakan reactjs? jika belum tahu anda dapat membaca postingan sebelumnya disini.

seperti yang anda ketahui reactjs merupakan library javascript, untuk itu kita perlu mengetahui tentang javascript. namun jika anda belum mengetahui tentang javascript anda hanya perlu belajar mengenai dasar-dasar javascript untuk lebih mengenal reactjs.

sebelum kita membahas mengenai lingkungan reactjs, saya merekomendasi IDE untuk penulisan code javascript kalian. IDE yang saya gunakan adalah Visual Studio Code. Nanti pada IDE ini kita akan juga menginstal extension untuk mempermudah kita dalam menulis code javascript kita. jika anda belum memiliki Visual Studio Code anda dapat mendownloadnya disini.

jika anda telah memiliki visual studio code , mari kita install extension yang membantu kita dalam menulis code kita nanti, adapun extension yang saya rekomendasikan adalah :

  1. ES7 React/Redux/GraphQL/React-Native snippets
  2. Beautify css/sass/scss/less
  3. Prettier – Code formatter

jika anda memiliki rekomendasi extension lain yang membantu anda menulis code javascript anda dapat menuliskannya dikolom komentar. kali ini saya tidak akan menjelaskan kegunaan extension tersebut, jika anda ingin menegetahuinya anda dapat membaca dokumentasi saat menginstall extension tersebut. dan yang paling penting untuk menyalakan autosave yang dihandle oleh prettier.

baiklah langsung saja kita membahas lingkungan kerja reactjs. sebelum itu mari kita install proyek reactjs kita dengan perintah dibawah ini.

npx create-react-app my-app
cd my-app
npm start

setidaknya file dalam folder proyek kita setelah membuat proyek adalah seperti dibawah ini :

Struktur Project React

Mari kita bahas satu persatu, untuk yang pertama mari kita bahas folder node-modules.

  1. node_modules

folder node_modules merupakan folder penyimpanan library library yang kita install dalam project reactjs. folder ini memakan tempat yang lumayan besar dalam project kita karena berisi library library penting yang membangun project kita nantinya. misalnya ketika kita menginstall suatu library baru maka file library tersebut akan tersimpan di folder node_modules.

2. public

folder public merupakan folder penyimpanan yang dapat di akses oleh user public pada aplikasi kita , folder ini biasa digunakan untuk menyimpan folder images , icon , atau favicon yang menjadi logo pada project kita.

3. src

folder src biasanya di isi file file penting dalam membangun project reatjs kita, biasanya folder ini berisi setup mengenai pembangunan website kita, tergantung setup yang nyaman bagi kita, umumnya folder ini berisi folder-folder lagi yang kita buat seperti folder assets,elements,pages,utilitas dan lain lain.

untuk lebih paham mengenai folder folder tersebut anda bisa mengikuti pada postingan selanjutnya mengenai menjalankan project react js kita !

reactjs
reactjs tutorial

Leave a Reply

Your email address will not be published. Required fields are marked *