Langsung ke konten utama

Postingan

Menampilkan postingan dengan label react

REACTJS #2 MEMBUAT COMPONENT

  Component dalam dunia pemrograman bisa di artikan sebagai bagian-bagian yang tersusun satu kesatuan dengan fungsi teretentu. ReactJS sebagai front end dari website mengadopsi sistem component, dimana website di bagi menjadi beberapa component kemudian digabungkan dalam satu frame. Component ini seperti navigasi, header, footer, content, dan lain sebagainya. Menariknya component yang dibuat pada ReactJS dapat digunakan berulang kali di tempat manapun. Contohnya ketika membuat sebuah card view , programer hanya perlu membuat satu component card view kemudian memanggilnya berulang kali sesuai yang di inginkan. Lalu bagaimana cara memulai membuat componetn di ReactJS ? Mari simak langkah-langkah di bawah ini. 1. Buka project yang telah di buat Bagi yang belum tahu cara membuat project baru ReactJS silahkan ikuti tutorial dari awal Cara Install ReactJs dengan Mudah . 2. Buat folder component Buka project baru yang telah dibuat lalu buat folder baru dengan nama component pada directo...

REACTJS #1 MEMBUAT TAMPILAN HELLO WORLD!

  Menampilkan tulisan ataupun tag HTML merupakan hal utama yang perlu diketahui dalam ReactJS. Seperti halnya ketika pertama kali mempelajari pemrograman bahasa lain akan diajarkan cara menampilkan tulisan. Pada pembelajaran pertama REactJS ini juga akan di ajarkan cara menampilkan tulisan berupa kata "Hello World!". Sebelumnya pastikan untuk membuat project baru terlebih dahulu. Untuk cara pembuatan project baru ReactJS silahkan baca Membuat dan Menjalankan Project Baru ReactJS . Selanjutnya ikuti langkah-langkah dibawah ini untuk memulai menampilkan tulisan. 1. Edit file App.js File JS utama yang pertama kali akan di eksekusi ketika program dijalankan adalah App.js yang berada di directory src -> App.js . Secara default untuk versi terbaru kodenya akan tampak seperti berikt : import React from 'react'; import logo from './logo.svg'; import './App.css'; function App() { return ( <div className="App"> <header classNa...