컴퓨터공방

/* eslint-disable */ // import logo from './logo.svg'; import React, {useState} from 'react'; import './App.css'; function App() { let [글제목, 글제목변경] = useState(['남자 코트 추천', '여자 스커트 추천', '남자 봄옷 추천']); let [따봉, 따봉변경] = useState(0); // deep copy function 글자순정렬() { var newArray = [...글제목]; newArray = newArray.sort() 글제목변경( newArray ); } return ( 개발 Blog 버튼 { 글제목[0] } {따봉변경( 따봉 + 1 )} }>👍{따봉} 2월 17일 발..

- 일단 변경함수 써야함 - 변경함수(대체할 데이터) state는 직접 건들지말고 deep copy해서 그걸 건드려라 *변경함수 제작시 기억할 것 1. 일단 기본 state 카피본 만들고 (Spread Operator) 2. 카피본에 수정사항 반영 3. 변경함수()에 수정사항 반영된 카피본 집어넣기 /* eslint-disable */ // import logo from './logo.svg'; import React, {useState} from 'react'; import './App.css'; function App() { let [글제목, 글제목변경] = useState(['남자 코트 추천', '여자 스커트 추천', '남자 봄옷 추천']); let [따봉, 따봉변경] = useState(0); /..

*따봉을 누를때마다 1이 증가하는 코드 /* eslint-disable */ // import logo from './logo.svg'; import React, {useState} from 'react'; import './App.css'; function App() { let [글제목, 글제목변경] = useState(['남자 코트 추천', '여자 스커트 추천', '남자 봄옷 추천']); let [따봉, 따봉변경] = useState(0); return ( 개발 Blog 버튼 { 글제목[0] } {따봉변경( 따봉 + 1 )} }>👍{따봉} 2월 17일 발행 { 글제목[1] } 3월 17일 발행 { 글제목[2] } 2월 17일 발행 ); } export default App; /* eslint-disa..

// import logo from './logo.svg'; import React, {useState} from 'react'; import './App.css'; function App() { let [글제목, 글제목변경] = useState('남자 코트 추천'); let [글제목2, 글제목변경2] = useState('여자 스커트 추천'); let [글제목3, 글제목변경3] = useState('남자 봄옷 추천'); return ( 개발 Blog { 글제목 } // 데이터 바인딩 2월 17일 발행 { 글제목2 } 3월 17일 발행 { 글제목3 } 2월 17일 발행 ); } export default App; state는 변수 대신 쓰는 데이터 저장공간이다. => HTML이 자동으로 재렌더링 된다. ..

왜 App.js가 메인페이지인가? index.js에서 public/index.html에 App.js의 HTML코드를 넣어달라고 작성되어 있음 index.js => public/index.html의 id root div에 태그를 넣어주세요 import React from 'react'; import ReactDOM from 'react-dom/client'; import './index.css'; import App from './App'; import reportWebVitals from './reportWebVitals'; const root = ReactDOM.createRoot(document.getElementById('root')); root.render( ); // If you want to ..

설치순서 1. Node.js 검색 후 최신버전 설치 => create-react-app 라이브러리를 사용하기 위해서 Node.js를 설치함, npm을 이용한다. 2. Visual Studio Code 에디터 설치 3. 폴더생성 4. 에디터에서 작업폴더 Open Folder 5. npx create-react-app 프로젝트명 입력 6. 프로젝트명의 하위폴더를 다시 Open Folder 7. 코드짠걸 미리보기 띄우기, 터미널에서 npm start 입력 Node.js Node.js® is a JavaScript runtime built on Chrome's V8 JavaScript engine. nodejs.org 새로운 React 앱 만들기 – React A JavaScript library for bui..

모바일 App처럼 스무스하게 동작하는 웹들 (SNS) 웹앱을 만들때 가장유용한 React 1. 앱으로 발행이 쉽다. 2. 앱처럼 뛰어난 UX 3. 그냥 웹사이트보다 비즈니스적 강점 바보도 이해할 수 있다는 코딩애플님의 강의 시작해보려한다.