솔적솔적

월간CS에서 1주차 react, next 배포, 배포 자동화 A부터 Z까지 수업을 참여하였습니다. 직접 실습하며 배웠던 내용, 실습 중 막혔던 부분과 해결과정들을 적어보려합니다. 👉 CI/CD란? 링크 클릭 👉 GitHub Flow 전략에 대한 이해 링크 클릭 👉 GitHub Action에 대한 이해 링크 클릭 🍖 CloudFront, S3 배포하기 👉 aws cli 링크 클릭 👉 terraform 링크 클릭 🍖 terraform이란? 클라우드 인프라스트럭처 자동화 도구 인프라를 구축, 변경, 버전관리위한도구로 코드로 인프라를 관리할 수 있게 한다. 🍖 Github Action github action용 폴더를 만들고 꼭! .github > workflows > .yaml 순으로 생성해야한다. deplo..

뷰말고도 리액트, 앵귤러도 똑같이 웹앱을 만들 수 있다. 리액트를 사용하는 개발자가 많은데 왜 뷰를 사용할까? 1. 쉽다.. 뷰.js를 쓰는 이유는 쉽다는 것. 그러면 기능이 떨어지는 거아니냐? 아니다. 다 똑같은 결과물을 낼 수 있고 그 만드는 과정이 쉽다는 것이다. React의 state변경, for변경, if 사용들을 보면 알 수 있다. 2. 개발할 때 방법이 정해져있다는 것 HTML을 내가 반복적으로 여러개 생성하고 싶다면? 리액트로는 map을 사용할지, forEach를 사용할지, 그냥 일반 for을 사용할지 반복문을 컴포넌트 render()바깥에서 사용할지 안에서 사용할지 자율적으로 판단하여 사용할 수 있다. vue.js는 그렇지 않다. html 여러개를 생성하고 싶다면 이 v-for만 사용하면..

리액트가 업데이트되고 나서 사용할 수 있는 신기능이 있다는데, 그것을 오늘 사용해보려한다. | 1. batch 기능 state변경함수들이 쭉 작성이 되어있다면 state변경이 일어날 때마다 재랜더링이 일어나는데 연달아서 여러개가있다면 재랜더링이 맨 마지막것만 재렌더링 1번만 일어나게하는 것이다. 이게 batch이라고 하는데, 예외가 있다. ajax요청, setTimeout 등의 내부코드라면 batch이 일어나지않았는데, 리액트 17버전에는 배칭이 일어나지않는다. 리액트 18버전이후에는 코드가 어디있던간에 잘 일어난다는 것. | 2. useTransition 동작이 느린 컴포넌트들을 빠르게 동작할 수 있게하는 것이다. import {useState} from "react"; function App2(){ ..

오늘은 성능향상 2탄, 원하는 자식컴포넌트의 재렌더링을 막을 수 있는 방법에 대해서 알아보고자한다. | 재렌더링 막는 방법 자식컴포넌트를 우선 하나 생성해보고, Cart안에 넣어놓는다. function Child() { return 자식컴포넌트 } function Cart(){ return ( ... ... )} state만들기 const [count, setCount] = useState(0) 버튼을 눌러 state변경하도록 하기 function Cart(){ const state = useSelector((state)=>{return state}) const dispatch = useDispatch();//store한테 요청을 보내주는 함수임 const [count, setCount] = useSta..