완로그
article thumbnail
[카카오테크캠퍼스 9주차 회고] 잠시만 안녕

⏳ 2023. 6. 5. - 2023. 6. 11. 리액트 너란 녀석 참.. 낯설다.. 9주차에는 지금까지 배운 기술로 회원가입 폼을 구현하는 시간을 보냈다. 아직까지는 js가 훨씬 익숙해서, js로 로직을 만들 때는 아 이건 이렇게 저건 저렇게 팍팍 생각이 났지만 리액트로 코드를 작성할 때는 굉장히 굉장히 어색했다. 구현 규모가 작아서 js에서 리액트로 바뀌는 이점을 크게는.. 못 느꼈지만, 큰 프로젝트에서 리액트는 빛을 발한다고 하니! 그날을 기다리며.. 공부하자! 아, 리액트로 구현한 폼은 실시간성이 보장되는 느낌이라 훨씬 유용해보였다. 다시 노션으로.. 리액트는 모르는 거 투성이라 실시간으로 노션에 정리하는 것이 훨씬 나을 것 같다고 판단했다. 그리고 왜 노션이 예뻐보이냐 리액트 선택 강의는 노션..

article thumbnail
[카카오테크캠퍼스 9주차] React로 구현하기

⏳ 2023. 6. 5. - 2023. 6. 11. 제어 컴포넌트와 비제어 컴포넌트 reference : [강의안] 제어 컴포넌트와 비제어 컴포넌트 제어 컴포넌트 : 리액트가 제어하는 폼 엘리먼트 비제어 컴포넌트 : 리액트로 제어되지 않는 폼 엘리먼트 폼 엘리먼트? Form을 구성하는 DOM 자체에서 상태를 가지는 DOM 엘리먼트(input, textarea, select) 리액트의 state가 아니라 DOM 자체의 state이기 때문에 리액트가 상태를 제어할 수 없다. 리액트가 DOM의 상태에 접근하려면 ref를 통해 접근해야 한다. 폼 엘리먼트가 아닌 다른 DOM 엘리먼트는 리액트의 state로 상태를 관리한다. 컴포넌트 내 직접 관리 부모로부터 props를 통해 상태 내려받기(상태 리프팅) 전역 s..

article thumbnail
[카카오테크캠퍼스 9주차] Vanilla JS로 구현하기

⏳ 2023. 6. 5. - 2023. 6. 11. 정규식 RegExr: Learn, Build, & Test RegEx RegExr is an online tool to learn, build, & test Regular Expressions (RegEx / RegExp). regexr.com 정규식 연습은 여기서! 회원가입 예제 GitHub - iam454/signup-app Contribute to iam454/signup-app development by creating an account on GitHub. github.com 알게 된 점 em을 사용하면 확대/축소 효과를 줄 수 있다. 코드를 처음 짤 때는 더러울(?) 수 있지만, 리팩토링을 통해 수정하면 된다! 이제 React로 구현 가보자고~