본문 바로가기

프론트엔드로 가는 길/코딩기능구현스터디8

1주차 과제 - 총정리 소요시간 : 23.01.10 ~ 23.01.28 생각 : 너무나도 게으른 탓에 너무 오랜 시간을 잡아먹었다. 그리고 성공하지 못한 기능도 있었다. 하나가 막히면 그 하나를 물고 늘어지는 바람에 더 오래 걸린 것도 있었다. 그 막힌 문제만 풀면 변기 뚫리듯 술술 풀리는데 말이다. 막힌다고해서 좌절했더니... 더 오래 걸렸던 것 같다. 지금은 올바른 코드도 아니고 깔끔하게 작성도 하지 않았다. 내 능력으로는... 이게 한계일까 생각이 들면서도 조금씩 올바르고 깔끔해지는 코드를 발견할 수 있을 거라 생각이 든다. 왜냐면 난 멋지고 대단하니까... 매일 공부를 하면서 느낀 것은 내가 집중력도 너무 없고, 의지가 박약이라는 것. 끈기가 없다보니 하다가 말고 하다가 말고 그래서 코드 작성하는데 뭐했더라 뭐해야하지를.. 2023. 1. 29.
1주차 과제 - 게시물 삭제 (5) 5. 게시물 삭제 기능 구현 ✅ 게시물마다 삭제하기 버튼을 만들고, 삭제하기 버튼을 클릭하면 해당 게시물이 삭제되어야 한다. 1. 삭제버튼만들기 { deletePosting(); }} /> 2. posting state 가져오기 3. 배열 객체 삭제하기 4. 배열 setPosting에 넣기 const deletePosting = (id) => { let copy = [...props.posting]; copy.splice(id, 1); props.setPosting(copy); }; 2023. 1. 29.
1주차 과제 - 좋아요/즐겨찾기(4) 4. 좋아요, 즐겨찾기 기능 구현 ✅ 게시물에 좋아요❤, 즐겨찾기⭐ 버튼을 만든다. ✅ 좋아요 버튼을 클릭하면 숫자가 1 올라가야 한다. ✅ 즐겨찾기 버튼을 클릭하면 즐겨찾기 버튼이 강조되고, 강조된 버튼을 다시 클릭하면 강조가 취소되어야 한다. + 좋아요를 한 게시물의 제목을 따로 모아서 볼 수 있는 리스트를 만든다. + 즐겨찾기를 한 게시물의 제목을 따로 모아서 볼 수 있는 리스트를 만든다. ✅ 게시물에 좋아요❤, 즐겨찾기⭐ 버튼을 만든다. [좋아요] ✅ 좋아요 버튼을 클릭하면 숫자가 1 올라가야 한다. { goodBtn(index); }} /> {props.posting[index].good} 1. App -> posting state에 good을 추가한다. let [posting, setPosti.. 2023. 1. 29.
1주차 과제 - 게시물 작성(3) 3. 게시물 작성 기능 구현 제목과 내용을 입력하고 제출을 하게 되면 (글 번호, 제목, 내용, 날짜)를 담은 게시물이 생성된다. ✅ 최근에 작성한 게시물이 상단에 생성되어야 한다. 1. App.js에 게시물 data를 state에 저장 let [posting, setPosting] = useState([ { id: 0, title: "첫 게시물 제목", content: "내용" }, ]); 2. posting state를 App에서 Header로 전달 3. props.posting state를 Header에서 Modal로 전달 4. 내용을 입력한 데이터를 posting 전달 const addContent = () => { let copyData = [...props.posting]; copyData.u.. 2023. 1. 28.