목록TDL (119)
\(@^0^@)/
- 드림 코딩 REACT 프로젝트 정리 최근 배운 이론들과 프로젝트를 하며 배운 것들 노션에 정리 react.memo가 안 먹혀서 한동안 헤매다가 도저히 모르겠어서 포기했는 네, 왜 갑자기 먹히는 걸까..? vscode와 터미널 재부팅을 2번 이상 했었는데 도대체 왜 갑자기 돼...!? 내 컴퓨터가 이상한 것 같다ㅠ 시간 낭비했어~ 그래도 내가 구현한 방식이 틀린 것이 아니라는 것을 알았으니 오히려 다행일지도ㅠ 매번 배운 것들을 티스토리에만 간단하게 적었던 이유가 사실 막상 내가 정리해둔 것을 읽으려면 잘 안 읽힐 때도 있고, 구글링 하면 나보다도 정리를 잘한 사람들이 수두룩 빽빽인데 굳이 내가 정리한 것을 읽을 필요를 못 느꼈었다. 하지만 가끔 내가 적은 것을 다시 한번 보고 싶고, 찾으려 하면 해시태..
- 드림 코딩 REACT 프로젝트 API 로직 분리 보통은 api 폴더 또는 대게는 client라고도 짓는다. client (또는 api): 백엔드의 API를 호출만 하고 데이터를 받아오는 역할만 함 (순수 통신) ➡ 이것만 빠르게 훑어보아도 앱에서 쓰는 네트워크 API (Rest APIs) 목록을 빠르게 파악할 수 있음 service: client에 있는 통신 로직을 사용하여 백엔드로부터 가지고 온 데이터를 우리 애플리케이션에서 필요로 하는 로직을 처리함. 어플단에 전달하기 전 데이터 처리 과정을 거치는 용도 (캐시를 하든지, 불필요한 데이터를 제거한다든지 등등) API KEY 은닉 env 파일은 공개 소스코드 리파지토리에 올리지 않아, 다른 사람들이 코드에서 값을 쉽게 보지 못하도록 만들 수 있다. ..
- leetcode 연결 리스트 알고리즘 https://www.youtube.com/watch?v=ggv5cnMspVQ - 드림 코딩 REACT 프로젝트 - 원티드 기업 채용 설명회 & 커리어 특강 기업의 주요 업무, 자격요건과 우대사항 조건에 내가 절반 이상 해당이 된다고 생각하면 일단 지원해보자! 채용공고에 많이 검출되는 키워드들을 이력서에 흡수시키자. 한눈에 나를 보여주는 영역 3-5줄 정도의 경력 중심 자기소개 어떤 실무적인 경험을 하였는지 -> 앞으로 어떤 업무를 맡을 수 있는지 어떤 성과를 냈는지 -> 경쟁자보다 뛰어난 사람임을 강조 구체적(정량적인 지표 사용)으로 작성 -> 객관성, 신뢰성, 빠른 이해 가장 어필하고 싶은 핵심 경험에 선택과 집중 업무보다는 성과 내가 어떻게 기여했고, 어떤 ..
- 프리 온보딩 챌린지 강의 이번에 8월 챌린지 신청하였다. 뭐라도 해야 조금 더 강제성을 갖고 할거 같아서... 리멤버에서 일하시는 개발자 분이 알려주시는데, 적극적으로 과제에 임해서 많은 것을 배워보자! 나만 적극적으로 열심히 한다면 배울 것은 많고, 배울 곳도 많다! https://www.wanted.co.kr/events/pre_challenge_fe_1 요즘엔 사이트에 태블릿 반응형은 안 하고 피시랑 모바일만 한다더니 사실인가 보군... 오늘을 시작으로 이번 주 토요일, 다음 주 화요일, 토요일 총 4번의 강의를 듣게 된다. 오늘은 처음이라 좋은 주니어가 되는 법, 기술 면접에서 주의해야 할 점들에 대해 강의를 해주셨다. 어떤 주니어를 뽑고 싶은가? 기본 지식이 아니라, 지식을 다뤄온 태도를 보..
- 알고리즘 leetcode 연결 리스트 1문제 아직도 연결 리스트라니... 하루에 적어도 한 문제씩 풀 수 있도록 노력하자! - 드림 코딩 TS 강의 클래스 생성자 함수 안에 속성?을 설정할 때 클래스 멤버 변수를 지우게 될 경우, type error가 발생한다. 무슨 말이냐면, 자바스크립트의 경우에는 아래와 같이 작성해도 에러가 나지 않지만, class GoodGreeter { constructor() { this.name = "hello"; } } 타입 스크립트의 경우에는 name property가 존재하지 않는다는 에러가 나타나는 것을 볼 수 있다. 그 이유는 타입 스크립트 이므로 지정해주지 않아서 당연히 에러가 나는 것. 따라서 타입 스크립트에서는 아래와 같이 타입 지정을 해주어야 한다. cla..
- 드림 코딩 REACT 강의 Deployment https://create-react-app.dev/docs/deployment Deployment | Create React App npm run build creates a build directory with a production build of your app. Set up your favorite HTTP server so that a visitor to your site is served index.html, and requests to static paths like /static/js/main..js are served with the contents of the /st create-react-app.dev CSS 전처리기, PostCSS..
- 제로베이스 TS 강의 Interface JavaScript에서는 존재하지 않는다. 객체의 타입을 정의하고 생김새를 가지도록 할 수 있다. TypeScript에서의 클래스 기능은 C#에서 유래된 것이 많다. 일부 기능은 TS에서만 존재하는 고유 문법으로 컴파일 후 사라진다. extends가 아닌 implements 키워드로 구현한다. 위에서 말했던 것처럼, 인터페이스는 JS에서 존재하지 않는 것을 볼 수 있다. Implements interface Fruits { name: string price: number discount(): void } interface Meat { name: string price: number typeOf: string } /* - interface의 설계를 구현한다. - ..
- 드림 코딩 REACT 강의 디렉터리 구조에서 public은 static 한 소스들, src는 dynamic 한 소스들 template 폴더를 생성하고 다른 폴더에 복사할 경우 cmd 명령어 /* cp -R template폴더 복제할폴더명 */ cp -R template to-do-list 최상단의 파일을 public의 index.html 안 div태그의 root. 즉, dom과 연결해주는 것이 react-dom import React from 'react'; import ReactDOM from 'react-dom'; import App from './App'; ReactDOM.render( , document.getElementById('root') ) React.StrictMode를 사용하면 이름..
- 제로베이스 TS 강의 접근제어자 속성과 메서드에 접근을 제한할 수 있다. 클래스 내부 구현 정보를 적당히 공개하여 일부분만 노출시킨다 API와 비슷한 흉내를 낼 수 있다. 타입 시스템을 이용해 규칙을 강제할 수 있다. 제어자 설명 public 어디서나 접근 가능 (기본값) protected 해당 클래스와 서브클래스에서만 접근 가능 private 해당 클래스의 인스턴스에서만 접근 가능 Static 클래스의 속성과 메서드를 new로 인스턴스화 하지 않고 호출할 수 있다. 접근 제어자를 활용할 수 있다. 몇 가지 정적 이름을 사용할 수 없다. 클래스는 그 자체로 new를 호출할 수 있는 함수이기 때문 추상 클래스 abstract를 선언한 클래스로 직접 인스턴스화 될 수 없는 클래스이다. 직접 인스턴스화 될..
- 드림 코딩 TS 강의 프로그래머가 열심히 작성한 코드를 프로그램 형태로 동작시키기 위해서는 그 프로그램이 동작할 수 있는 환경. 즉, 언어나 이진법 형태로 변환해주는 작업을 거쳐야 하는데 그 작업을 도와주는 것이 컴파일러(compiler) Compile time에 타입이 결정되고 확인할 수 있으면 statically typed Rumtime 환경 때 타입이 결정되는 것을 dynamically typed js는 dynamically typed이기에 유연하고 초반에 배우기 쉽지만 가독성이 떨어지고, 불안전하다. dynamically typed 변수에 선언한 타입을 다른 곳에서 재할당하며 타입 변환이 가능함. ex) js, python, ruby, php let name = 'amy'; name = 23;..