![]()
안녕하세요! delay100입니다. 이번 포스팅에서는 컴포넌트의 라이프사이클 메서드에 대해 공부해봅시다. 대부분의 설명은 주석으로 달아놓았으니 코드에 대한 설명은 주석을 확인해주세요! 책 리액트를 다루는 기술, 개정판의 7장 내용을 다루고 있습니다. 프로젝트 실행 방법에 대한 설명은 여기에 있습니다. 이번 포스팅의 Github 링크 https://github.com/delay-100/study-react/tree/main/ch7/hello-react GitHub - delay-100/study-react Contribute to delay-100/study-react development by creating an account on GitHub. github.com 1. 라이프사이클? 모든 리액트 컴포..
![]()
안녕하세요! delay100입니다. 이번 포스팅에서는 map에 대해 공부해봅시다. 대부분의 설명은 주석으로 달아놓았으니 코드에 대한 설명은 주석을 확인해주세요! 책 리액트를 다루는 기술, 개정판의 6장 내용을 다루고 있습니다. 프로젝트 실행 방법에 대한 설명은 여기에 있습니다. 이번 포스팅의 Github 링크 https://github.com/delay-100/study-react/tree/main/ch6/hello-react GitHub - delay-100/study-react Contribute to delay-100/study-react development by creating an account on GitHub. github.com 1. map? map이란? - 배열 객체의 내장 함수 - 반..
![]()
안녕하세요! delay100입니다. 이번 포스팅에서는 ref에 대해 공부해봅시다. 대부분의 설명은 주석으로 달아놓았으니 코드에 대한 설명은 주석을 확인해주세요! 책 리액트를 다루는 기술, 개정판의 5장 내용을 다루고 있습니다. 프로젝트 실행 방법에 대한 설명은 여기에 있습니다. 이번 포스팅의 Github 링크 https://github.com/delay-100/study-react/tree/main/ch5/hello-react 1. ref(reference)? ref(reference)란? - 리액트 프로젝트 내부에서 DOM에 이름을 다는 방법(HTML에서 id를 사용하여 DOM에 이름을 다는 것과 유사) - DOM을 꼭 직접적으로 건드려야할 때 사용함 간단한 ref 예시 // id가 root인 요소에 ..
![]()
안녕하세요! delay100입니다. 이번 포스팅에서는 이벤트 핸들링에 대해 공부해봅시다. 대부분의 설명은 주석으로 달아놓았으니 코드에 대한 설명은 주석을 확인해주세요! 책 리액트를 다루는 기술, 개정판의 4장 내용을 다루고 있습니다. 프로젝트 실행 방법에 대한 설명은 여기에 있습니다. 이번 포스팅의 Github 링크 https://github.com/delay-100/study-react/tree/main/ch4 GitHub - delay-100/study-react Contribute to delay-100/study-react development by creating an account on GitHub. github.com 1. event(이벤트)? event(이벤트)란? 사용자가 웹 브라우저에서..
![]()
안녕하세요! delay100입니다. 이번 포스팅에서는 Component에 대해 공부해봅시다. 대부분의 설명은 주석으로 달아놓았으니 코드에 대한 설명은 주석을 확인해주세요! 책 리액트를 다루는 기술, 개정판의 3장 내용을 다루고 있습니다. 프로젝트 실행 방법에 대한 설명은 여기에 있습니다. 이번 포스팅의 Github 링크 https://github.com/delay-100/study-react/tree/main/ch3/hello-react GitHub - delay-100/study-react Contribute to delay-100/study-react development by creating an account on GitHub. github.com 1. Component 기본 Component(컴..
![]()
안녕하세요! delay100입니다. 이번 포스팅에서는 JSX에 대해 공부해봅시다. 대부분의 설명은 주석으로 달아놓았으니 코드에 대한 설명은 주석을 확인해주세요! 책 리액트를 다루는 기술, 개정판의 2장 내용을 다루고 있습니다. 프로젝트 실행 방법에 대한 설명은 여기에 있습니다. 이번 포스팅의 Github 링크 https://github.com/delay-100/study-react/tree/main/ch2/hello-react GitHub - delay-100/study-react Contribute to delay-100/study-react development by creating an account on GitHub. github.com 1. JSX 기본 JSX란? - 자바스크립트의 확장 문법 -..
![]()
안녕하세요. delay100입니다. 이번 포스팅에서는 VSCode 사용 시, 언어를 변경하는 방법을 다뤄봤어요! 1. VSCode를 킵니다. 2. F1 을 누른 후, Configure Display Language 입력 후 Enter를 누릅니다. 3. 원하는 언어를 클릭합니다. 4. 아래의 팝업창에서 Restart를 누릅니다. 5. 그럼, VSCode가 자동으로 꺼졌다가 켜지면서 설정한 언어로 바뀌게 됩니다!
![]()
안녕하세요! delay100입니다. 오늘부터 React를 공부하려고 해요! 공부한 것들 중에 중요한 것들은 기록해보겠습니다. 책 리액트를 다루는 기술, 개정판의 1장 내용을 다루고 있습니다. 이번 포스팅의 Github 링크 https://github.com/delay-100/study-react/tree/main/ch1/hello-react GitHub - delay-100/study-react Contribute to delay-100/study-react development by creating an account on GitHub. github.com 내 PC에 이미 있는 개발환경 - React 공부 시 계속 사용합니다. VS Code(비주얼 스튜디오 코드) git bash Node.js - 설치..
![]()
안녕하세요. delay100입니다. 오늘은 Github를 꾸며보려고해요! 아직 제 깃허브는 매우 날 것이기 때문에... Github를 꾸미면서 팁 같은 것들을 정리하는 포스트가 되겠네요 ㅎㅎ. 같이 꾸미러 가봅시다! 인터넷에 Github 프로필 꾸미기를 검색하면, ReadMe.md를 사용해서 꾸미는 방법이 많이 나옵니다. 이 포스팅에서도 README.md를 이용해 프로필을 꾸며보겠습니다. 1. ReadMe.md 생성 아무 README를 추가하면 되느냐? 그건 아닙니다. 자신의 Github아이디와 동일하게 레퍼지토리를 생성해줍니다. 또한 README.md 파일 추가에 체크를 해줍니다. 레퍼지토리 이름에 자신의 계정 아이디를 적으면 special 하다고 반겨줍니다!! 깃허브의 마스코트 고양이도 너무 귀엽네요..
![]()
우선 이걸 하기위해 삽질을 엄청나게!!! 많이,,했다,.. 약 2일정도 헤맸다ㅠㅠ 삽질 과정도 아래에 추가했다... 아마도 EC2를 쓰는 사람들은 저렇게 하면 될 것 같다..!정확하진 않지만 Google Search Console? 자신의 도메인을 구글 검색에 등록하는 것이다! 이 작업을 해주지 않으면 구글에 내 도메인이 뜨지 않음..! 1. Lightsail로 배포한 사이트 Google Search Console과 연결하기 결국 이 사이트를 보고 해결했다!!!! 다시 블로그에 정리해보자면,, Google Search console 사이트에 접속해 "시작하기" 버튼을 클릭한다. "도메인"에 자신의 도메인을 입력한다. www를 제외하고 나는 tasteyom.com을 배포할 것이기 때문에 그대로 입력해준다!..
