본문 바로가기

Hello! I'm haein, a junior front-end developer. Welcome to my space.
간단한 자기소개 '◡'
안녕하세요. 정리하는 것이 주특기이고, 인문논술로 대학을 가서 나름 글쓰기에 자부심(?)이 있는 주니어 개발자입니다. 개발 공부를 하면서 좀 더 정돈된 기록을 해보고 싶어서 블로그를 시작하게되었습니다. 게시글 하나하나 정말 정성스럽게 열심히 썼구요. 되도록이면 공식문서를 참고해서 객관적이고 정확한 정보를 작성하려고 노력했습니다. 그리고 제가 이해가 될 정도로 디테일하게 서술해서 웬만한 사람들도 이해가 가능할 것이라는것이 저의 뇌피셜입니다. 아무쪼록 저의 글을 읽는 사람들이 어떤 방향으로든 도움이 되셨으면 좋겠습니다. 참고로 연보라, 연핑크를 좋아하구여, 그라데이션도 좋아합니다. 그래서 내 취향에 맞게 커스텀 했습니다 ㅎㅎㅎ MBTI는 ISTJ입니다. 너무 TMI라서 toggle로 해뒀습니다. 궁금한 사람들은 펼쳐보시겠죠?

State

(3)
[React] 데이터 추가하기, 배열 리스트 만들고 추가하기 (일기장 만들기 4탄) 코드가 1탄부터 이어지기 때문에 1탄부터 보고 오셔야 합니다~! 1탄 https://dev-ini.tistory.com/73 - 추가, 수정, 삭제와 같은 이벤트들은 setData 같은 함수를 props로 전달해서 아래에서 위로 올라가는 구조이다. - 에서 새로운 일기를 작성하면 "생성"이라는 이벤트가 발생한다. - 이벤트는 에서 전달한 상태변화함수(setData)를 호출해서 data를 변화시킴으로써 이뤄진다. - data는 위에서 아래로만 움직인다. - data가 변화하게 되면 다시 아래로 떨군다. 위의 설명을 토대로 일기장 리스트 추가 기능 구현해보기 App.js import './App.css'; import DiaryEditor from './DiaryEditor/Diary..
[React] 데이터 리스트 렌더링 (조회) (일기장 만들기 3탄) 코드가 1탄부터 이어지기 때문에 쭉 보고 오셔야합니다~ 1탄 https://dev-ini.tistory.com/73 { return ( 일기 리스트 ); } export default DiaryList; 2. App.js에서 컴포넌트를 불러온다. App.js import './App.css'; import DiaryEditor from './DiaryEditor/DiaryEditor'; import DiaryList from './DiaryList'; function App() { return ( // 컴포넌트를 불러온다. ); }; export default App; 3. 리스트 데이터를 만든다. App.js import './App.css'; import DiaryEditor from './Diary..
[React] State 뜻, 카운터 함수, 예시 목차 1. State 란? 2. State로 카운터 함수 만들어보기 3. State를 세팅해주는 2가지 방법 4. State를 사용한 예시 (분→시간 변환기) State 란? - 계속해서 변화하는 특정 상태 - 상태에 따라 각각 다른 동작을 함 State로 카운터 함수 만들어보기 Counter.jsx const Counter = () => { return ( 0 + - ); }; export default Counter; - Counter 컴포넌트에서 동적으로 변화해야하는 유일한 값은 태그 사이에 있는 카운트 숫자 0임 - 카운트 숫자가 '상태'임 - 기본값이 0에서 출발하고 1씩 증가, 1씩 감소하는 Count 상태 import React,{useState} from 'react'; // state는 ..