la-commune.com – Jika Anda suka, Anda dapat memeriksa hasil akhir di sini: Hasil Akhir. Jangan khawatir jika kode reactjs tersebut tidak masuk akal bagi Anda, atau jika menggunakan sintaks yang tidak dikenal. Kami akan belajar bagaimana membangun game ini selangkah demi selangkah sepanjang tutorial ini.Coba mainkan game. Anda juga dapat mengklik tombol di daftar pindahkan untuk pergi “kembali dalam waktu” dan melihat apa yang tampak seperti papan setelah langkah itu dibuat.Setelah Anda sedikit mengenal permainan ini, jangan ragu untuk menutup tab itu, karena kami akan mulai dari template yang lebih sederhana di bagian selanjutnya.

reactjs

Prasyarat
Kami akan mengasumsikan beberapa keakraban dengan HTML dan JavaScript di design online , tetapi Anda harus dapat mengikuti bahkan jika Anda belum pernah menggunakannya sebelumnya.Jika Anda membutuhkan penyegaran tentang JavaScript, sebaiknya baca panduan ini. Perhatikan bahwa kami juga menggunakan beberapa fitur dari ES6, versi terbaru JavaScript. Dalam tutorial ini, kami menggunakan fungsi panah, kelas, biarkan, dan pernyataan konstituen. Anda dapat menggunakan reactjs Babel REPL untuk memeriksa apa yang dikompilasi oleh kode ES6.

Cara Mengikuti Bersama
Ada dua cara untuk menyelesaikan reactjs tutorial ini: Anda dapat menulis kode tepat di browser, atau Anda dapat mengatur lingkungan pengembangan lokal di komputer Anda. Anda dapat memilih salah satu opsi tergantung pada apa yang Anda rasa nyaman.

Jika Anda Lebih Memilih Menulis Kode di Browser
Ini adalah cara tercepat untuk memulai!

Pertama, buka kode starter ini di tab baru. Ini harus menampilkan bidang reactjs tic-tac-toe kosong. Kami akan mengedit kode itu selama tutorial ini.Anda sekarang dapat melewati bagian berikutnya tentang pengaturan lingkungan pengembangan lokal dan langsung menuju ke ikhtisar.Jika Anda ingin melakukannya, berikut langkah-langkah yang harus diikuti:

READ  Cara ampuh bermain game facebook di android

Pastikan Anda memiliki versi terbaru Node.js yang diinstal.
Ikuti petunjuk pemasangan untuk membuat proyek baru.

npm install -g create-react-app
create-react-app my-app Hapus semua file di src / folder dari proyek baru (jangan hapus folder, hanya isinya).
cd my-app
rm -f src/*
Tambahkan file bernama index.css di src / folder dengan kode CSS ini.

Tambahkan file bernama index.js di src / folder dengan kode JS ini.

Tambahkan tiga baris ini ke atas index.js di src / folder:

import React from 'react';
import ReactDOM from 'react-dom';
import './index.css';
Share Sobatmu Yang Kurang Piknik :)