tictactoe 썸네일형 리스트형 비전공자의 프로젝트 만들기) TicTacToeApp (Function Type) TicTacToe 만들기 2탄 어제 만들었던 TicTacToe App을 class문법이 아닌 function 문법으로 변경 작업을 진행했다. 단 이번에는 굳이 CRA 해서 로컬에서 만들지 않고 CodeSandBox를 이용해서 진행한다. 리액트 16 버전부터 생긴 ReactHook을 사용해 변경 작업을 진행한다. 먼저 Board부터 변경하였다. import React, { useState } from "react"; import Square from "./Square"; const Board = () => { const [squares, setSquares] = useState(Array(9).fill(null)); const handleClick = (i) => { const squaresClone = .. 더보기 비전공자의 프로젝트 만들기) TicTacToe App (Class Type) TicTacToeApp React 공식 사이트에 있는 틱택톡 예제를 만들었다. 프로젝트에는 css내용은 웬만해서 적지 않을 예정이다. npx create-react-app tictactoe_app 우선 틱택톡 앱을 만들기 위해서 리액트 프로젝트를 만들어 주었다. 기본틀부터 작업하였다. App.js import './App.css'; function App() { return ( ); } export default App; 이제 컴포넌트를 생성해 app.js에 출력되게 만들 예정이다. src하위 폴더에 컴포넌트폴더를 생성 후 Board와 Square를 만들어준다. Square.js import React, { Component } from 'react' export default class Square e.. 더보기 이전 1 다음