전체 글 썸네일형 리스트형 코딩앙마 React공부 (state, useState) state는 컴포넌트가 가지고있는 속성값입니다. 이 속성 값이 변하면 자동으로 UI를 업데이트 시켜준다.(개발자는 state만 잘 관리하면 화면을 다시 들여주는 작업을 신경쓰지 않아도 된다.) ex) 위와 같은 방법을 쓸 경우 컴포넌트가 몇개던지 각 컴포넌트의 기능을 따로 수행한다. 더보기 코딩앙마 React공부 (이벤트 처리) 1. 미리 함수로 만들어놓고 전달해주는것 2. 두번째로 내부에 직접 함수 작성하는 법 (장점 = 매개변수를 전달하기 편하다) 3. input창을 만들고 작성할때 마다 로그를 찍는 방법 더보기 코딩앙마 React공부 (CSS 작성법) create-react-app으로 만든 프로젝트라면 별도의 패키지 설치없이 바로 사용할 수 있는 방법이 3가지가 있다. 1. inline style 사용 (css파일을 따로 생성하지 않고 HTML태그에 바로 작성하는 방법)주의할 점, 객체로 작성해야한다 / 카멜케이스로 작성해야한다.일반적으로 마크업할때도 마찬가지겠지만, 특별한 이유가 없으면 inline으로 작성하지 X 2. 프로젝트 생성시 만들어지는 css파일들을 사용하는 방법(index.css는 전체 프로젝트에 영향을 미치는 css이고, App.css는 App컴포넌트에 한정되어있는 내용들이 들어가있는것을 볼수 있다.)한가지 문제점이 있다면, App.css는 App컴포넌트에만 적용되는것이 아니다. 예를 들어,box라는 className을 생성하고 .. 더보기 코딩앙마 React 공부(첫 컴포넌트 만들기) 컴포넌트를 생성하기위해 컴포넌트 폴더를 만들고 컴포넌트 파일을 생성한다 (컴포넌트는 대문자로 시작해야한다.) 컴포넌트 작성 방법 3가지 작성한 컴포넌트를 사용하는 방법 App.js로 가서 import Hello from './component/Hello';를 작성하여 컴포넌트를 import시켜준다. 컴포넌트를 원하는 위치에 작성해준다 (HTML 태그처럼 작성) 만약 와 사이의 ddd가 적힌 부분에 내용이 들어갈 필요가 없다면 만 작성해도된다. 이대로 저장을 하게되면 에러가 나거나 아무것도 안뜨는 하얀 화면 일것이다. (=> 왜냐? p태그는 return을 시켜줘야하기 때문) 이제 Welcome이라는 컴포넌트를 생성하고 위와 똑같은 방식으로 실행해보자 다음은 World라는 컴포넌트 생성후 Hel.. 더보기 경산 면접 후기 겸 복기 우선 경산에 있는 면접을 3시 까지 가기로했으니 10~20분 정도 일찍 도착 해서 가자마자 바로 면접을 시작함 기술질문- React를 어디까지 공부했는지? (꼬리질문 한 3~4개?)- Node.js와 Spring Boot의 차이 인성질문- 입사하게 된다면 집을 구할 것인지?- 성격의 장단점- 1분 자기소개- 입사하게 된다면 수습기간이 있는데 괜찮냐? (ex : 기간을 정해두고 일을 같이 해본 다음 근로계약서 작성) => (사실 이게 수습기간인건지 아니면 기업과 나의 일하는 방향성을 맞춰보고 정하는건지 의문 / 수당은 당연히 지급해준다고 했음) 면접 후기 => 약간 뭐랄까 평소보다는 면접 분위기가 편했던 것 같은 면접보고 나니 후련함 + 걱정이 공존하더라구요(Spring Boot와 Node.js 둘 중에서.. 더보기 코딩앙마 React 공부(컴포넌트, JSX) React로 만든 페이지는 컴포넌트로 구성되어 있다. 페이지 단위로 HTML을 작성하는 것이 아닌 각 부분을 컴포넌트로 만들어서 조립해서 사용하는 것이다. (=> 코드의 재사용과 유지보수) 전에 공부했던 것이 그대로 남아있다면 하나의 컴포넌트(App.js)가 있을것이다. App컴포넌트는 함수로 만들어져있고 Default로 export 되고 있다는 것을 알수있다. 이것을 indes.js에서 import해서 사용하고있다 함수로 만들어진 컴포넌트 = 함수형 컴포넌트모든 컴포넌트는 대문자로 시작해야 한다. (함수가 리턴하는 것은 JSX(=JavaScript XML)이다.) class는 자바스크립트 예약어기 때문에 className으로 작성해야한다. style은 객체로 전달해야 적용된다. css에서 쓰는 .. 더보기 코딩앙마 React 공부 (설치 및 폴더 구조 이해 하기) npx create-react-app 폴더명 (ex : npx create-react-app voca) 이후 npm start를 통해 웹페이지를 띄우기 src폴더에 App.js를 열고 p태그를 수정해보면 띄운 페이지에 수정사항이 그대로 반영되는것을 확인할 수 있다. 이제 App.js에서 뭔가를 수정하거나 작성하면 브라우저에 바로 반영이 된다 -> 이걸 Hot Module Replacement(HMR)이라고 한다.터미널에서 ctrl+c를 누르면 프로젝트가 내려간다. 하지만 프로젝트를 다시 띄울수 있는데 그 명령어는 package.json파일에 명시 되어있음 - start : 개발모드로 프로그램을 실행- build : 실제 배포 모드로 만들어줌- test = 테스트- eject : 내부 설정 파일을 꺼내.. 더보기 면접 후기(울산) 기업명은 혹시의 상황을 대비해 비공개 하겠습니다. 면접 때 받은 질문1. 프로젝트 관련 기술 및 맡은 역할에 대한 질문2. 프레임워크와 라이브러리의 차이 (답변 X)(크게 이 두가지 였던거 같고 나머지 질문들은 1번 질문에서 꼬리질문 형식으로 많이 나왔던거 같습니다.)2번 답변 :프레임워크와 라이브러리는 둘 다 코드 작성에 도움이 되는 타인이 작성한 코드의 집합이다.프레임워크는 프로그램이 필요한것을 개발자에게 알려줌으로써 제어권을 역전하고, 라이브러리는 개발자가 필요할 때 마다 설치, 혹은 호출함으로써 개발자가 능동적으로 사용하게 된다. 더보기 이전 1 ··· 4 5 6 7 8 다음
