본문 바로가기

전체 글

240628 TIL 1. 오늘 한 일- 리액트 입문주차 복습하며 투두 만들어보기  2. 느낀 점- useState에 대한 원리는 입문 강의 들어보면서 이해했다. 전보다는 코드치는 속도는 확실히 빨라졌음 입문에서는 styled-components를 쓰지 않고 한줄로 쓰다보니 코드 길이가 더 길어지니 파일을 따로 빼서 쓰는게 훨씬나아 보인다. - 전에 react에 대해 아무것도 모를 때 app.jsx에 몰아서 작성했는데 components 폴더를 만들고 그 밑에 파일을 만들어관리해서 app.jsx에 import하는 방식으로 했다. 아무것도 모르고 할 때랑 알고 다시 해볼 때랑은 차이가 나서 조금은성장했구나 느꼈다. 코드 치는게 빨라졌달까? 아직 모르는 건 많지만 열심히 해봐야지 취업까지 화이팅. 근데 기본적인 건 알지만 아직까.. 더보기
240627 TIL 1. 오늘의 공부 - 타입스크립트 리액트 과제 (제출까지 완료)- 자바스크립트와 타입스크립트 공식 사이트에서 문서 읽기 (내 자신이 부족해서 하는 공부)  2. 개념 정리  💡 자바스크립트 - 함수 출처 : https://developer.mozilla.org/ko/docs/Web/JavaScript/Guide/Functions 함수 - JavaScript | MDN함수는 JavaScript에서 기본 구성 요소 중 하나입니다. JavaScript의 함수는 작업을 수행하거나 값을 계산하는 명령문의 집합인 프로시저(procedure)와 비슷하지만, 프로시저가 함수로 쓰이려면 입력을developer.mozilla.org  - 함수는 매개변수들, 괄호로 묶고 쉼표로 구분함 - 함수를 정의하는 Javascrip.. 더보기
240626 TIL 🧸 오늘의 공부 : TypeScript ) 수준별 학습 때 배웠던 내용을 위주로 정리해보려고 함!  어려웠던 점은 일반 React 프로젝트 세팅할 때랑은 달라서 일일이 찾아보고 했다. 이런 저런 명령어 시도해보다가 망했는데 이 명령어로 vite + typescript react 세팅하는데 성공했다. 잊어버리지 않기 위해 여기에 적어둔다  yarn으로 설치할 때 yarn create vite my-react-app —template typescript   🎈 오늘 배운 내용 정리  ! : 타입 단언 / non null assertion 연산자 > null 타입이 아님을 단언 Api response에 대한 타입 지정하기 : types 폴더 밑에 타입 관련 파일 만들어주기 (ex. todo.type.ts).. 더보기
240625 TIL 오늘의 공부 : Typescript 내일 강의 다시 반복 듣고 과제 시작해야 할 것 같다. 아직 타입스크립트에 대해 이해를 못했다.😂강의 들으면서 중요한 개념 위주로 정리..  객체 지향 설계 원칙 S.O.L.I.D★ S(SRP 단일 책임 원칙) - 클래스는 하나의 책임만 가져야 함 - 5개의 설계 원칙 중에 가장 기본적이고 중요한 원칙- 유저 서비스에선 유저 관련된 액션만 해야함 - 만약에 이메일 관련된 기능을 추가하고 싶으면 이메일 서비스 클래스를 따로 만들어서 총괄해야 함 O(OCP. 개방 폐쇄 원칙)- 클래스는 확장에 대해선 열려있어야 하고 수정에 대하여선 닫혀있어야 함 - 기존 코드를 변경하지 않아도 기능을 확장할 수 있어야함- 인터페이스나 상속을 통해 해결 가능L(LSP. 리스코프 치환 원칙.. 더보기
240624 TIL 오늘 새로운 주차가 시작돼서 Typescript에 대해 짧게 정리를 해보려고 한다.  🫡강의 완강하면 다시 반복해서 들어볼 예정.. (하지만 과제 때문에 주말에 들어볼 예정이긴 함..!) [Typescript] - 타입스크립트에서 타입을 올바르고 명확히 사용하면 코드의 가독성이 높아지고 유지보수가 쉬워진다.  기본 타입으로는 boolean / number / string / 배열 / 튜플(tuple) / enum 등이 있고const를 선언하면 상수가 되며 값을 변경하기 어렵다 > 연산자로 다시 할당이 불가능, let을 이용해 선언하면 변수가 되고 값을 변경하는 게 가능. Readonly는 객체의 속성을 불변으로 만드는 데 사용하며 , 클래스, 인터페이스의 속성을 변경할 수 없게 만들 수 있음  가변적인.. 더보기
240621 TIL 💁🏻‍♀️ [ 아웃소싱 프로젝트 마지막날 - KPT 회고 ] ❤️ Keep - 현재 만족하고 있는 부분- 조원들과의 활발한 의사소통을 통해 프로젝트를 이어나갈 수 있었던 점이 좋았고, 이번 프로젝트를 통해 배워 나갈 점이 많았던 게만족스러웠다. 덕분에 4~5일동안 지치지 않았던 것 같습니다 :) - 서로 모르는 부분이 있을때 알려주면서 서로서로 배워나갈 수 있었던 점이 좋았습니다. ❓Problem - 불편하게 느끼는 부분-  딱히 없었습니다.  🔜 Try -  Problem에 대한 해결책, 당장 실행 가능한 것-  모르는 부분이 있거나 조원이 어려움이 있을 때 공유해주면서 다같이 문제점을 찾아가는 점은 해볼수 있을 듯 합니다.    i think 😵‍💫 4.5일 프로젝트 기간 동안 시도해보지 못.. 더보기
240620 TIL 👩🏻‍💻 [아웃소싱 프로젝트 4일차] 🌱   🔜 오늘 프로젝트때 한 일 날짜랑 카테고리 보이게 하고 스타일 주기 ✅카테고리를 검색했을 때 해당 카테고리 post가 콘솔에 뿌려지는 건 확인함 ✅navbar에 카테고리 검색했을 때 (ex : 운동) 해당 post만 나오게 메인 페이지에 보이게 하기 ❌  🍀  해당 코드  > 스타일 컴포넌트 const StyledInformation = styled.p` font-size: 14px; color: #323232; float: right; margin-top: 15px; margin-right: 20px;`;  > 리턴하는 코드 return ( {posts .filter((p.. 더보기
240619 TIL [아웃소싱 프로젝트 3일 차] ui는 완성되었고 나는 팀원분이 만들어두신 supabase database를 불러오는 코드만 작성했고, 불러오는 데 성공했다! 저녁 이후에 시작해서 얼마 걸리지 않았던 것 같다.  나중에 프로젝트 때 참고할 것 같아서 TIL에 작성해 두고 기록해두려 한다 :>  supabase 관련 파일을 mainmap.jsx에 import 해준다 import { getPost } from '../../../supabase/post.api';  useState , useEffect 이용하여 supabase 데이터 베이스를 불러오는 코드를 작성 const [posts, setPosts] = useState([]); useEffect(() => { const fetchData = asy.. 더보기