전체 글 썸네일형 리스트형 240701 TIL 1. 오늘의 공부 Next.js를 배우는 첫날이었다. 강의 보면서 직접 실습 해보려고 순서에 맞게 설치했는데 계속 에러가 뜨길래 읭? 해서 강의의 흐름만 파악하는 방향으로 틀어서 강의를 시청하였다. 계속 폴더 삭제하고 다시 만들고 했는데 자포자기한 심정으로 cd my-app 치고 yarn dev해보니next.js 화면이 잘뜬다! (localhost:3000) 내일부터 강의 마저 듣고 과제 시작해야지! ▶️ react.js와 next.js의 차이 React.js : UI 만들기 위한 라이브러리 (필요한 패키지들을 수동으로 설치해줘야 함)Next.js : 리액트가 가지고 있는 기능을 확장 (프레임워크) - 이미 설치가 다 되어있음 TTV란? Time To View의 약자로 사용자가 최초 뷰를 볼.. 더보기 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.. 더보기 이전 1 2 3 4 ··· 9 다음
