Git Product home page Git Product logo

gethired-latihan-frontend-react's Introduction

Devcode Starter using React

Hasil Akhir yang Diharapkan

Peserta dapat menampilkan Halaman Hello yang berisi Logo Devcode dan Teks I'm ready for the next challenge!.

Setup Environment

  1. Download source code melalui link yang telah disediakan dari halaman assesment
  2. Extract source code yang sudah terdownload pada perangkat anda
  3. Buka source code yang sudah diextract menggunakan Code Editor, contoh Visual Studio Code
  4. Jalankan npm install pada terminal
  5. Jalankan npm run start pada terminal
  6. Akses localhost:3000 pada browser

Instruksi Pengerjaan

Level 1

  1. Selesaikan semua TODO yang terdapat pada file index.js, HelloWorld/index.js
  2. Buat online repository di Github (Jika belum memiliki akun Github, silahkan daftar disini
  3. Push project ke online repository yang sudah anda buat
  4. Deploy project ini ke Hosting yang anda miliki atau bisa juga menggunakan layanan hosting gratis seperti Vercel (Jika belum memiliki akun Vercel, silahkan daftar disini

Level 2

  1. Selesaikan semua TODO yang terdapat pada file services/index.js, contacts/index.js
  2. Buat online repository di Github (Jika belum memiliki akun Github, silahkan daftar disini
  3. Push project ke online repository yang sudah anda buat
  4. Deploy project ini ke Hosting yang anda miliki atau bisa juga menggunakan layanan hosting gratis seperti Vercel (Jika belum memiliki akun Vercel, silahkan daftar disini

Level 3

  1. Selesaikan semua TODO yang terdapat pada file services/index.js, InputContactForm/index.js
  2. Buat online repository di Github (Jika belum memiliki akun Github, silahkan daftar disini)
  3. Push project ke online repository yang sudah anda buat
  4. Deploy project ini ke Hosting yang anda miliki atau bisa juga menggunakan layanan hosting gratis seperti Vercel (Jika belum memiliki akun Vercel, silahkan daftar disini

Untuk Dokumentasi API yang digunakan pada challenge ini dapat diakses disini.

Level 4

  1. Selesaikan semua TODO yang terdapat pada file services/index.js, contacts/index.js, InputContactForm/index.js, ContactItem/index.js
  2. Buat online repository di Github (Jika belum memiliki akun Github, silahkan daftar disini)
  3. Push project ke online repository yang sudah anda buat
  4. Deploy project ini ke Hosting yang anda miliki atau bisa juga menggunakan layanan hosting gratis seperti Vercel (Jika belum memiliki akun Vercel, silahkan daftar disini)

Untuk Dokumentasi API yang digunakan pada challenge ini dapat diakses disini.

Level 5

  1. Selesaikan semua TODO yang terdapat pada file InputContactForm/index.js
  2. Buat online repository di Github (Jika belum memiliki akun Github, silahkan daftar disini)
  3. Push project ke online repository yang sudah anda buat
  4. Deploy project ini ke Hosting yang anda miliki atau bisa juga menggunakan layanan hosting gratis seperti Vercel (Jika belum memiliki akun Vercel, silahkan daftar disini)

Untuk Dokumentasi API yang digunakan pada challenge ini dapat diakses disini.

Teknologi yang Digunakan

  1. React
  2. ReactDOM
  3. React Router
  4. React Testing Library
  5. Axios

Langkah-langkah membuat repositori baru di Github

  1. Klik tombol New yang terletak di bawah username pada bagian kiri halaman utama Step 1
  2. Juga bisa klik pada ikon + yang ada di sebelah ikon notifikasi pada pojok kanan atas halaman utama Step 2
  3. Jika klik ikon +, maka langkah selanjutnya adalah pilih opsi New Repository Step 3
  4. Selanjutnya isi kolom Repository name dengan nama repositori yang akan dibuat Step 4
  5. Tambahkan deskripsi repositori pada kolom Description, langkah ini opsional Step 5
  6. Setelah itu, pilih opsi Public di bawah kolom Description Step 6
  7. Klik tombol Create Repository untuk membuat repositori baru di Github Step 7
  8. Setelah selesai, anda akan diarahkan ke halaman repo baru yang sudah dibuat sebelumnya. Silahkan ikuti langkah-langkah untuk clone repo yang sudah dibuat ke local anda Step 8

Langkah-langkah Deploy menggunakan Vercel

  1. Klik tombol Add New... pada halaman dashboard vercel Step 1
  2. Pilih opsi Project Step 2
  3. Pilih opsi Continue with Github pada bagian Import Git Repository Step 3
  4. Klik tombol Import pada repository yang akan dideploy Step 4
  5. Klik tombol Deploy pada bagian Configure Project Step 5
  6. Tunggu proses build hingga deploy selesai Step 6
  7. Jika proses deploy berhasil, akan diarahkan ke halaman success seperti pada gambar di bawah ini. Lalu klik tombol Continue to Dashboard pada halaman success Step 7
  8. Klik tombol Visit pada halaman dashboard project untuk melihat hasil deploy Step 8

gethired-latihan-frontend-react's People

Contributors

haniframadhani avatar

Watchers

 avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.