Frontend 개발자 - hyo.loui

📝 WIL: Weekly I Learned Work done this week 이번 주 끝낸 일! 티스토리 포스팅 = 매일 TIL 일지 (자바스크립트 스터디 내용) Project : Develife = 프로젝트 완성 ( 배포 >> 발표 ) javascript 스터디 = 각자 발표 chapter 1주차 마무리(모던 자바스크립트 딥다이브 교재) Project review 이번 프로젝트가 마무리되어 유튜브에 시연영상을 업로드 했다. https://www.youtube.com/watch?v=rfuRtHsHwQ4&t=49s OBS 소리가 작다...😥 Study review 부족하다고 생각했던 자바스크립트를 900페이지가 넘는 모던 자바스크립트 - 딥다이브 교재를 활용해서 한챕터 한챕터 서로가 준비하고, 발표하면서..

❤️‍🔥TIL : Today I Learned strict mode 모던하게 javscript 코드를 작성하기 위해서는 strict mode(엄격 모드) strict mode란? function callMyName () { me = 'seung hyo'; } callMyName(); console.log(me); // ? 위 코드에서 자바스크립트엔진이 어떻게 동작할까? 1. 선언하지 않은 me 변수에 값 'seung hyo'을 할당했다. 2. js엔진은 me 라는 변수가 어디에 선언 되었는지 스코프 체인을 통해 검색한다. 3. callMyName 함수의 스코프에서 me 변수의 선언을 검색한다. 4. 검색에 실패한다. 5. me 변수를 검색하기 위해 callMyName 함수 컨텍스트의 상위 스코프(전역 스..

❤️‍🔥TIL : Today I Learned 사전적 정의 property : 소유물 attribute : 속성 프로퍼티 어트리뷰트 내부 슬롯과 내부 메서드 프로퍼티 어트리뷰트를 이해하기 위해 먼저 내부 슬롯과 내부 메서드의 개념을 알아보자. ECMAScript 사양에서 사용하는 의사 프로퍼티와 의사 메서드 이다. 이중 대괄호 로 감싼 이름들이 내부 슬롯과 내부 메서드다. ( [[...]] ) 이들은 자바스크립트 엔진에서 실제로 동작하지만 개발자가 직접 접근할 수 있도록 공개된 객체의 프로퍼티는 아니다. 즉 내부 슬롯과 내부 메서드는 자바스크립트 엔진의 내부 로직이므로 원칙적으로 직접 접근하거나 호출할 수 없다. 그러나 일부 내부 슬롯과 내부 메서드에 한하여 간접적으로 접근할 수 있는 수단을 제공하기는 ..

❤️‍🔥TIL : Today I Learned 함수는 마치 재료를 투입받아 제품을 생산하는 기계와 같다. 함수 자바스크립트에서 가장 중요한 핵심 개념 [스코프, 실행 컨텍스트, 클로저, 생성자함수에 의한 객체 생성,메서드, this, 프로토타입, 모듈화] 등이 모두 함수와 깊은 관련이 있다. 함수란 함수는 일련의 과정을 문(statement)으로 구현하고, 코드블록으로 감싸서 하나의 실행단위 로 정의한 것 이다. 여기서 자주 햇갈리는 내용인 매개변수와 인수가 있다. 매개변수(parameter)는 함수를 선언(정의)할 때 사용하는 변수를 의미한다. 인수(argument)는 함수를 호출할때, 즉 입력될 때 넣는 값을 인수라고 한다. 함수 정의 함수를 정의는 다양한 방법이 있지만 함수 선언문을 사용하여 정의한..

❤️‍🔥TIL : Today I Learned 제어문을 사용하면 코드의 실행 흐름을 인위적으로 제어할 수 있다. 제어문(control flow statement) 조건에 따라 코드 블록을 실행(조건문)하거나, 반복실행(반복문)할 때 사용한다. 블록문(block statement) 0개 이상 의 문을 중괄호로 묶은 것으로, 코드 블록 또는 블록이라고 부르기도 한다. { } 문의 끝에는 세미콜론을 붙이는 것이 일반적이다. 하지만 블록문은 언제나 문의 종료를 의미하는 자체 종결성을 갖기 때문에 블록문의 끝에는 세미콜론을 붙이지 않는다. // 블록문 { var foo = 10; } // 제어문 var x = 1; if (x < 10) { x++; } // 함수 선언문 function sum(a, b) { ret..

❤️‍🔥TIL : Today I Learned 프로그래밍 언어에서 데이터를 관리하기 위한 핵심 개념 변수 하나의 값을 저장하기 위해 확보한 메모리 공간 자체 또는 그 메모리 공간을 식별하기 위해 붙인 이름을 말한다. 변수란 무엇인가? 왜 필요한가? 애플리케이션은 데이터를 다룬다. 아무리 복잡해도 데이터를 입력(input)받아 처리하고, 결과를 출력(output)하는 것이 전부다. 컴퓨터는 CPU를 사용해 연산하고, 메모리를 사용해 데이터를 기억한다. 메모리 메모리(memory)는 데이터를 저장할 수 있는 메모리셀의 집합체다. 1바이트 단위로 데이터를 저장(save)하거나 읽어(read) 들인다. 각 셀은 그림의 왼쪽에 보이는 것 처럼 메모리 주소를 갖는다. 메모리 공간의 위치를 나타낸다. 컴퓨터는 모든 ..

📝 WIL: Weekly I Learned Work done this week 이번 주 끝낸 일! 티스토리 포스팅 = 매일 TIL 일지 (목적, 정리로 세분화) Project : Develife = 프로젝트 시작 ( 기획 >> 와이어프레임 >> 레이아웃(UI) javascript 스터디 = 각자 발표 chapter 정하고 시작(모던 자바스크립트 딥다이브 교재) 📚 Study review 프로젝트 마무리가 되어가면서 이번주는 공부에 목적을 두지 못했다.. 이번 팀원을 잘 만나서 모던 자바스크립트 스터디를 결성하고 한달 이내에 모든 챕터를 하나씩 돌아가면서 정해둔 발표시간 (약 15분)에 발표를 하고, 나머지 챕터는 정독 하면서 스터디를 하기로 결성되었다! 자바스크립트가 내용이 이렇게 많은 줄도 몰랐고 이렇..

🎯목적 : 타입 스크립트 리펙토링 과정 정리 🤢 트러블 슈팅 : Comment 타입 overlap 에러 1. typescript 환경 세팅 Develife 프로젝트는 리액트로 다 작성되어 배포까지 마친 상태였다. 처음 진행 해야하는 작업은 typescript의 패키지를 설치해야 한다 npm install typescript @types/node @types/react @types/react-dom @types/jest dependenci에 설치가 완료 된 후, tsc --init 명령어로 tsconfig.json 파일이 생성되었는지 확인한 후, jsx를 인식 못하는 오류를 방지하기 위해 주석처리 되어있는 16번째 라인의 주석을 해제하며, "JSX": "preserve", >> "JSX": "react" ..