분류 전체보기182 [깃] VSCode를 사용하다 보면 따라다니는 master VSCode를 사용하다 보면 어느새 붙어 있는 (master) 깃 관리 들어간 것도 아닌데 자동으로 붙는 걸 해결하고자 조사. 우선 사용했던 불필요한 브랜치 정리(삭제) git branch -d 브랜치 이름 깃이 관리하는 것을 중단하고 싶다면, 깃을 관리하는 숨김폴더인 .git를 완전히 삭제하고 히스토리를 초기화 rm -rf .git 어느 폴더에서부터 깃 관리가 시작된건지 몰라서 깃이 붙어있는 최상단 디렉토리를 찾아 .git 제거 명령을 작성했다. 2023. 2. 15. [VSCode] 단축키 도움말 tab > 바로가기 키 참조 터미널의 내용을 지우고 싶을 때, 따로 단축키 지정을 안했을 때 clear 명령어를 입력하면 터미널이 깨끗해진다. 2023. 2. 13. [깃헙] 레포 클론 후 다른 원격저장소에 연결되었을 때 팀 플젝을 위해 팀 포크 레포를 클론한 뒤, 원격저장소를 다시 확인해보니 다른 레포(pr.git)가 붙어 있는 것이었다. !! 클론 레포를 제대로 원격저장소 설정을 다시 하고 싶다면, 원하는대로 클론 레포로 원격저장소 연결 완료 !!!! 2023. 2. 13. [StephenGrider 강의] 모던 리액트와 리덕스 - state in 클래스기반 컴포넌트 state는 자바스크립트 객체로, 유저 이벤트를 저장하고 반응하는데 이용된다. 클래스형 컴포넌트는 그 자신의 복사된 state 객체를 가지고 있고, state가 바뀔때마다 컴포넌트는 즉시 리렌더링하고 자식요소들에게도 렌더링하도록 강제한다.(render 함수 실행) state를 사용하기 전에 state 객체를 초기화해야 하므로, 클래스의 constructor 메소드 안의 자바스크립트 객체에 state들의 프로퍼티(아래에서는 term)를 정하여 넣는다. 위의 초록색 점선 박스 부분이 클래스형 컴포넌트에서 state를 정의하거나 초기화하는 방법이다. cf. 함수형 컴포넌트는 state를 가지지 않는다. 모든 자바스크립트 클래스는 constructor라는 함수를 가지고 있고, 클래스가 생성될 때마다/ 새 인스턴.. 2023. 2. 7. [StephenGrider 강의] 모던 리액트와 리덕스 - 개발환경 설정 프로젝트를 실행하기 위한 도구들을 설치해야 하는데, 우선 노드 패키지 매니저(NPM)를 사용하여 프로젝트를 실행한다. npm 설치로 프로젝트의 의존성(프로젝트를 구성하여 작동시는 여러 패키지들)을 관리할 수 있게 된다. npm install 보일러플레이트 패키지를 시작하고 로컬 서버를 실행시킨다. npm start 이 패키지 안에는 자바스크립트 파일을 포함해 여러 파일들이 있는데, 바벨과 웹팩이 이 모든 것들을 합치고, ES5로 변환시켜 브라우저에서 작동되게끔 만든다. 그리고 이 모든 파일들을 볼 수 있는 로컬서버를 이용할 수 있게 해준다. 아래와 같이, 컴파일이 끝난 전체 패키지를 볼 수 있다. 위의 코드에서 보다시피, 이 패키지는 로컬서버 localhost:8080으로 들어갈 수 있다. 프로젝트의 i.. 2023. 2. 3. [KDT] JSON JSON(JavaScript Object Notation) : 자바스크립트 데이터를 표현하는 하나의 포맷 속성-값(attribute-value)의 쌍, 객체 데이터의 형태와 유사 인간이 읽을 수 있는 텍스트를 사용하는 개방형 표준 포맷 비동기 브라우저/ 서버 통신(AJAX)을 위해, 그리고 넓게는 XML을 대체하는 주요한 데이터 포맷 특히, 인터넷에서 자료를 주고 받을 때 그 자료를 표현하는 방법. JSON의 공식 인터넷 미디어 타입은 application/json이며, JSON의 파일 확장자는 .json이다. - 기본 자료형 수 문자열: 0개 이상의 유니코드 문자들의 연속. 문자열은 큰 따옴표로 구분하며 역슬래시를 통한 이스케이프 문법 지원 불리언: 참, 거짓 배열: 순서가 있는 리스트 객체 널: 빈 .. 2023. 1. 27. [winterlood 강의] React App 만들기 note React.js : Node 기반의 JS UI 라이브러리 Webpack : 여러 개의 자바스크립트 파일을 하나의 파일로 합쳐주는 모듈 번들 라이브러리 Babel : JSX 등의 쉽고 직관적인 자바스크립트 문법을 사용할 수 있도록 해주는 라이브러리 Create React App : 리액트에 필요한 패키지들과 복잡한 환경설정 등을 미리 설치해놓고 바로 사용할 수 있도록 감싸놓은 패키지(Boiler Plate; 틀, 표준의 의미) '보일러 플레이트' 용어의 기원 >> https://whynameitthat.blogspot.com/2013/10/boiler-plate.html Boiler Plate The origins of interesting names of places, people, products, b.. 2023. 1. 20. [winterlood 강의] 리액트가 필요한 이유 리액트가 필요한 이유 1. 산탄총 수술(Shotgun Surgery) : 여러 파일에 걸쳐 중복 코드들(ex. header, footer 등)이 작성된 프로그램에서 그 중복 코드 내에 수정이 생기면 그 코드를 포함하고 있는 많은 파일에 이를 일일이 수정 적해줘야 하는 문제가 생김. => 각 페이지에 공통적으로 적용될 부분들은 별도의 파일이나 모듈로 제작 ; 컴포넌트(Component)화 방식 리액트는 컴포넌트 기반의 UI 라이브러리 2. 선언형 프로그래밍 : 예전에 주로 사용하던 제이쿼리(jQuery)는 절차를 하나하나 다 나열해야하는 명령형 프로그래밍 방식의 설계이다. 절차 대신 목적을 먼저 말하는 선언형 프로그래밍 방식의 설계의 리액트가 프론트엔드 측면 개발에서는 더욱 효율적이다. 3. 가상 돔(Vi.. 2023. 1. 16. [KDT 강의] 리액트 뜯어보며 이해하기 2 props : 부모 컴포넌트로부터 상속받는 자식 컴포넌트에 데이터를 전달하는 방법 자식 컴포넌트에서 읽기 전용(immutable)으로 사용되며, 변경하고자 할 때는 부모 컴포넌트에서 state를 조작해야 한다. VS state : 해당 컴포넌트 내에서 데이터를 전달하는 방법 변경 가능(mutable)하고 변경이 되면 화면이 re-render 된다. 자식 컴포넌트의 state들을 한 곳에서 모아 유지해야 하거나, 두 개의 자식 컴포넌트들이 서로 통신을 해야해서 가능하게 하려면, 부모 컴포넌트에 공유 state를 정의해야 한다 ! => 부모 컴포넌트는 props를 사용해 자식 컴포넌트에 state를 다시 전달할 수 있고, 이를 통해 자식 컴포넌트들이 서로 혹은 부모 컴포넌트와 동기화하도록 만든다. React.. 2023. 1. 13. 이전 1 2 3 4 5 ··· 21 다음
