충청 ICT취창업 역량강화프로그램 개발일지(10/20)

git hub는 전에 회원가입만 했었는데 아직 올려본적이 없었다,, 앞으로 미니 프젝도 할것이고 포트폴리오 작성해야하니 드디어 올려본다,,!

 

우선  github 사이트에 홈 화면 가보면

이렇게 나타나는데 먼저 왼쪽 부분에 초록색 버튼 new를 누른다.

 

누르면, 

 

 

이런식으로 Repository name에 작성 하는 게 나오는데 여기다가 이름을 적을 것을 적고

 

모든 사람들이 볼 수 있는 public에 체크를 납두고 add를 해둔다.

 

 

 

 

마지막으로 add.gitignore에 노드를 검색해서 하고 license는 자유롭게 입력한다.

 

그러고 나서, 터미널에 

npx create-react-app my-app
cd my-app
npm start

 

해주고 

 

 

 

이렇게 나올 텐데,, git hube에 커밋을 해준다. 글을 작성하고 나면 아래의 그림처럼 숫자가 생기는데 그걸 클릭해서

 

플러스 부분을 눌러서 주고 이름을 생성해서 커밋해서 올려주면 코드 내용들이 깃허브에 변경되어 올라가게 된다.

 

참고로,

 

이런 명령어도 존재하니, 깃허브 사용할 때 유용하게 쓰면 된다.

 

 

 

______________________________________________________________________________________________

 

 

 

Done. todos를 map이란 매소드를 이용하여 훑어준다. idx와 index가 같다면 e. target.checked 해주고 아닌 것은 isdone해준다. 그러고 새로운 nextDoneTodos를 setDoneTodos에 넣어준다.

 

 

 

 

 

 

하나의 content만 넣어주는 것이 아니라, 위의 사진처럼 todo object를 만들어주어 하나의 객체를 만들어준다.

만약 isDone 부분을 하나 수정하려면 그 하나만 수정할 수 있는 것이 아니라 전체적으로 함께 바꿔줘야 바꿀 수 있다.

 

 

 

<button

onClick={() => {

  const nextTodos = todos.filter((_, idx) => idx !== index);

  setTodos(nextTodos);

}}

></button>

 _는 해당변수쓰지않기때문에 이용하지않는다는 의미이다.

 

 

 

 

 

타켓인덱스가 아닌 경우,  필터링해서 보여주고 일치하는 경우는 제거한다. 새로운 todos를  만들어서
settodos로 업그레이드 했다는 것이다!

 

 

app.js 부분을 들어가서 좀 수정해보니까,

 

이런식으로 간단한 토대를 만들 수 있었다..

 

________________________________________________________________________________________________

 

 

오늘 첫 리액트 실습! 날인데 빠릇빠릇 하게 진행이 되고 줌으로 강의해주셔서 메모하기 급급했다,, 하지만 그 후 복습으로 영상은 더 보고 나선 조금이나마 알 것 같기도 하다!!!!!  아직은 감이 서지 않지만 그래도 해보는거지 !!!
파이팅 해보장,,,