newChobo
article thumbnail
노마드코딩 수강일지 07 / ReactJS #7 PRACTICE MOVIE APP
공부/ReactJS 2022. 12. 24. 20:39

2022/12/24 약 15:00~ 시험이다 뭐다 해서 한동안 작업을 진행하지 못했다... 간만에 하는거라 좀 가물가물 하지만, 화이팅 해서 진행해보자 작업하던 폴더는 react-for-beginners #7.0 To Do List part One (13:00) 이번 챕터는 State, Effect, Props 연습할것 CreateReactApp을 사용하면 새로고침할 필요가 없다는듯. 아마 내장된 기능이 아닐까 싶음. State는 직접적으로 수정할 수 없다. 배열에 내용물을 추가하고 싶어도, 직접 push 하는건 문제가 됨. food = [1, 2, 3, 4]; [6, food] 로 배열을 합치면, [6, Array(4)]가 됨. 내용물을 합치고 싶으면, [6 ...food] 로 만들면 [6, 1, 2,..

article thumbnail
노마드코딩 수강일지 06 / ReactJS #6 EFFECTS
공부/ReactJS 2022. 11. 27. 17:09

개발 시작할 때 npm start 명령어를 통해 개발자서버를 열 수 있다 6.0 Introduction import Button from "./button" import styles from "./App.module.css"; import { useState } from "react"; function App() { const [counter, setValue] = useState(0); const onClick = () => setValue((prev) => prev + 1); //이전 값을 활용해 다음 값을 만들어내도록 인자를 주었음 return ( {counter} click me! ); } export default App; 아래(수강일지 02)에서는 current를 변수로 활용하였는데, 그냥 아..

노마드코딩 수강일지 04 / ReactJS #5 노드 JS 설치, 환경 세팅
공부/ReactJS 2022. 11. 26. 23:53

https://nomadcoders.co/react-for-beginners/lectures/3279 All Courses – 노마드 코더 Nomad Coders 초급부터 고급까지! 니꼬쌤과 함께 풀스택으로 성장하세요! nomadcoders.co package.json 안에 많은 스크립트들이 저장되어있음 react팀에 의해 개발된것들 5.1 props, 컴포넌트 등 을 create-react-app 으로 해볼 것 버튼이나 그런것들을 파일에 다른 파일에 만들어두고, 필요한 파일에서 불러와서 사용하는 방식 css 모듈? 필요한 모든걸 파일화해서 저장하면 너무 방대해짐. 그렇다고 하나하나 쑤셔넣는것도 싫어? Button.module.css import PropTypes from "prop-types"; imp..

노마드코딩 수강일지 03 / ReactJS #4 PROPS, Memo
공부/ReactJS 2022. 11. 20. 21:51

#4 PROPS 4.0 PROPS 저번 시간에 배운것 const [amount, setAmount] = React.useState(0); const onChange = (event) => { setAmount(event.target.value); } {index === "xx" ? "Please select your units": null} 오늘 Props : 부모컴포넌트로부터 자식컴포넌트에 데이터를 보낼 수 있게 해주는 방법 우리가 만드는 컴포넌트들은 괄호로 인자를 받아온다. 인자를 props, properties라고 부름 ex) 같은 스타일의 버튼 여러개를 만들때 버튼 하나하나에 스타일을 복붙하는것은 낭비. 그것을 해결해보려 함 리엑트가 프롭들을 자동으로 넣어주어, 내가 사전자료형처럼 넣는 효과라고 ..