끄적끄적 메모장

먼저 일반 함수에 대해서 알아보자면 1. this 동작 일반 함수는 호출되는 방법에 따라 'this' 가 동적으로 바뀔 수 있습니다. 메소드로 호출되면 주로 객체를 가르키고, 단독으로 호출되면 전역 객체를 가리킬 수 있습니다. function example() { console.log(this); } const obj = { method: example, }; obj.method(); // obj를 가리킴 example(); // 전역 객체를 가리킴 (브라우저에서는 window) 2. 생성자 함수 일반 함수는 생성자로 사용될 수 있습니다. 생성자 함수는 'new' 키워드로 객체를 생성할 때 사용됩니다. function Person(name) { this.name = name; } const person ..

React에서 컴포넌트는 재사용이 가능한 UI 요소를 나타냅니다. 간단히 말해서 UI를 구성하는 작은 부분들을 컴포넌트들로 조힙하여 전체 애플케이션을 구축하는 개념입니다. 이러한 구조는 코드를 이해하거나 유지보수하기에 쉽게 만들어줍니다. 만들어진 컴포넌트는 원하는 곳에서 사용할 수 있습니다. 컴포넌트 만드는 방법 1) function을 이용해서 함수를 하나 만들어주고 작명합니다. 2) 그 함수 아네 return() 안에 축약을 원하는 HTML을 담으면 됩니다. 3) 원하는 곳에 을 사용하면 축약한 HTML이 등장하게 됩니다. 컴포넌트 만들때 주의점 1) 함수명으로는 맨 앞글자에 대문자를 유지해줘야 합니다. 2) retrutn 안에는 항상 하나의 으로 이루어져야 합니다. 3) function App(){}..

프로그래밍 언어에서 데이터를 다루는 데 사용되는 두 가지 주요 유형인 기본타입과 참조타입에 대해서 알아보자. 1. 기본타입 ( Primitive Types) - 기본타입은 간단한 데이터 값을 저장합니다. - 일반적으로 정수, 실수, 문저, 불리언 들이 여기에 속합니다. - 변수에 직접 값이 저장되며, 해당 값은 스택 메모리에 저장됩니다. - 대표적인 예시로는 int, float, char, boolean 등이 있습니다. ex) int x = 5; // 기본타입 변수 int y = x; // 값이 복사됨 x = 10; // x의 값 변경해도 y에 영향 없음 System.out.println(y); // 출력: 5 2. 참조타입 ( Reference Types) - 참조 타입은 객체를 가르키는 주소를 저장합..

JS에는 Scope(스코프) 라는 단어가 있습니다. 이게 무엇인지 알아보도록 하자. Scope란? 변수에 접근할 수 있는 범위 입니다. JS에는 2가지의 스코프 타입이 있습니다. ( 전역 스코프 / 지역(함수) 스코프 ) 지역(함수) 스코프란? 함수가 선언되면 하나의 스코프가 발생하는데 이걸 함수스코프라고 합니다. 함수에서 선언한 변수는 해당 함수 내에서만 접근 가능합니다. function abc() { var aa = '12'; // 함수 내부에서 선언 } console.log(aa); // Uncaught ReferenceError: aa is not defined 위 이미지 처럼 함수 외부에서 aa를 호출하게 되면 변수는 지역 스코프 이므로 함수 내에서만 사용이 가능하여 undefine 이 뜹니다...

여러 사람과 개발을 할때 협업이 많이 중요하다. 그에 따라 GIT을 통해 협업을 할때 어떤 명령어들을 사용하는지에 대해서 알아보자. [ GIT 명령어 ] git clone 원격 저장소의 복사본을 로컬에 생성할 때 사용하는 명령어 입니다. 위 이미지처럼 git clone 명령어를 활용하여 로컬 환경에서 원격 저장소에 있는 복사본을 받아와서 작업이 가능합니다. git commit 저장소에 있는 내용을 변경해서 하나의 커밋으로 저장하는 명령어 입니다. git branch 여러명의 작업을 할때 작은 단위로 나누어 서로의 작업 공간을 만들수 있게 해주는 명령어 입니다. 위 이미지와 같이 원격 저장소(main)에 newImage(브랜치)를 만들어 작업 공간을 만들 수 있습니다. git checkout 원하는 브랜치..

git에 대해서 작업을 할때 기초부터 배우지 않고 실무할때 필요할때만 작업해서 이번에 git에 대해서 기초부터 공부를 시작해 보자 먼저 Git은 무엇일까? git은 개발자들이 개발을 할때 자신의 코드를 효율적으로 관리할 수 있게 도와주는 협업 소프트웨어입니다. git을 통해 개발자들은 프로젝트를 서로 공유하며 각자의 개발을 한 후 병합하여 관리할 수 있도록 해줍니다. 또한 Github라는 git를 활용하여 온라인상으로 등록해주는 웹서비스가 있습니다. 베포뿐만 아니라 다운로드도 가능하며 수정하고 재베포하기에 편합니다. Git 명령어 정리 git init // 현재 폴더에 작업을 하겠다. (초기 설정) vim f1.txt // 현재 디렉토리 안에 파일을 하나 생성한다. // 안에서 입력 모드를 할려면 i를 ..

회사에서 새로운 프로젝트를 맡으면서 새로운 프레임워크로 개발을 하게 되었다. Next.js 라는 React 라이브러리 프레임워크인데 이걸 왜 사용해야 하는지 어떻게 사용해야 하는지에 대해서 공부를 해보자 ! Next.js란? React 라이브러리의 프레임 워크이다. 기본적으로 React는 CSR(Client-Side Renderting)를 사용하고 있습니다. Next.js는 SEO(Search Engine Optimization)를 위한 SSR(Server-Side Rendering)를 사용하고 있습니다. CSR같은 경우 모든 JS 파일을 로드하고 사용자는 웹을 보게 됩니다. 이때까지 사용자는 많은 시간을 대기해야합니다. 이를 SEO에서는 서버에서 JS파일을 로딩함으로써 클라이어트 측에서는 JS파일을 로..

타입스크립트로 처음으로 프로젝트를 시작할때 tsconfig.json파일을 생성하여 기본 세팅을 해줘야 한다. tsconfig.json파일에 들어가는 요소들에 대해서 알아보자 { "include": ["src"], "compilerOptions": { "outDir": "build", "target": "ES6", "lib": ["ES6", "DOM"], "esModuleInterop": true, "strict": true, "allowJs": true, "skipLibCheck": true } } ● include : [ src ] 타입스크립트가 src의 모든 파일을 확인한다는 것을 의미한다. ● outDir 자바스크립트 파일이 생성될 디렉터리를 지정해 준다. ● target 어떤 버전의 자바스크립트로..