판수개발자

npm : 자바스크립트 언어를 위한 패키지 관리자로 Node.js의 기본 패키지 관리자 - package.json을 사용해 패키지를 확인하고 버전을 기록할 수 있다. yarn : facebook에서 만든 자바스크립트 패키지 매니저npm의 단점(속도, 안정성, 보안성)을 해결하기 위해 제작 속도(performance) yarn은 다운받은 패키지 데이터를 캐시에 저장하여 중복된 데이터는 다운로드 하지 않고, 캐시에 저장된 파일을 활용함으로써 이론적으로 npm에 비해 패키지 설치속도가 매우 빠르다. 또한 패키지 설치시 병렬처리 구조이기 때문에 performance와 speed가 증가된다. 안정성(stability)/보안성(security) npm은 패키지가 설치될 때 자동으로 코드의 의존성을 실행할 수 있도록..

개념적으로 컴포넌트는 JS함수와 유사하다. props라고 하는 임의의 입력을 받은 후 화면에 어떻게 표시되는지를 기술하는 React 엘리먼트를 반환한다. 함수 컴포넌트와 클래스 컴포넌트 컴포넌트를 정의하는 가장 간단한 방법은 JS함수를 작성하는 것이다. function Welcome(props) { return Hello, {props.name}; } 이 함수는 데이터를 가진 하나의 "props" (props는 속성을 나타내는 데이터이다.) 객체 인자를 받은 후 React 엘리먼트를 반환하므로 유효한 React 컴포넌트이다. 이러한 컴포넌트는 JS함수이기 때문에 "함수 컴포넌트"라고 호칭한다. 또한 ES6 class를 사용하여 컴포넌트를 정의할 수 있다. class Welcome extends React..

엘리먼트는 React앱의 가장 작은 단위이다. 화면에 표시할 내용을 기술함 const element = Hello, world; 브라우저 DOM 엘리먼트와 달리 React엘리먼트는 일반 객체(plain object)이며 쉽게 생성할 수 있다. React DOM은 React 엘리먼트와 일치하도록 DOM을 업데이트 한다. 컴포넌트와 엘리먼트를 혼동하지 말 것! 엘리먼트는 컴포넌트의 구성요소이다 DOM에 엘리먼트 렌더링하기 HTML 파일 어딘가에 가 있다고 가정해 본다면 const element = Hello, world; 이 안에 들어가는 모든 엘리먼트를 React DOM에서 관리하기 때문에 이것을 '루트'DOM 노드라고 부른다. React로 구현된 애플리케이션은 일반적으로 하나의 루트 DOM노드가 존재, ..

REACT 공식문서를 토대로 학습한 내용을 정리하기 위해 작성하였다. 빠른 시일내에 공식문서를 익혔으면 좋겠다. JSX(표현식)란 JavaScript에 XML을 추가한 문법이다. 그러므로 JS의 모든 기능이 포함되어 있음. 작성 코드는 브라우저에서 실행되기 전에 번들링 과정에서 바벨을 사용해 일반 JS 형태의 코드로 변환된다. React에서는 본질적으로 렌더링 로직이 UI로직과 연결된다. 컴파일이 끝나면 JSX표현식이 정규 js 함수 호출이 되고 js객체로 인식된다. 즉 JSX를 if 구문 및 for loop 안에 사용하고, 변수에 할당하고, 인자로서 받아들이고, 함수로부터 반환할 수 있다. JSX 문법규칙 1. 컴포넌트에 여러 요소가 있다면 반드시 부모 요소 하나로 감싸야 한다. function App..

문제 정수 X에 사용할 수 있는 연산은 다음과 같이 세 가지 이다. X가 3으로 나누어 떨어지면, 3으로 나눈다. X가 2로 나누어 떨어지면, 2로 나눈다. 1을 뺀다. 정수 N이 주어졌을 때, 위와 같은 연산 세 개를 적절히 사용해서 1을 만들려고 한다. 연산을 사용하는 횟수의 최솟값을 출력하시오. 첫째 줄에 1보다 크거나 같고, 106보다 작거나 같은 정수 N이 주어진다. DP 문제를 풀이하면서 이해가 잘 가지 않는 부분이 있어 정리해보았다. DP란 문제를 더 작은 단위의 문제들로 나눈다. 작게 나누어진 문제들의 풀이들을 재귀적인 방식으로 최적화 솔루션을 찾음 Tree 형태의 탐색 방식이라고 보아도 무방 모든 상태에 대해 최적의 결과를 모두 어딘가에 ‘저장’ 하고 있다는 사실도 잊지 말자. 즉 모든 ..

Vue.js 와 React.js의 초기설치 방법에 대해서 정리했습니다. 1) vue 2.0 node.js를 다운로드 받고 npm install vue를 통해 vue를 설치한다. vue install -g @vue/cli vue init webpack 프로젝트명 2.0 버전과는 다르게 vue 3.0버전에서는 vue create 프로젝트명 으로 vue 프로젝트를 설정할 수 있다. 3.0버전에서도 2버전의 vue init webpack 프로젝트명 를 사용 할 수 있다. cli는 전역으로 설치하는 vue전용 npm패키지로서 reacte appr과 비슷한 초기세팅을 도와주는 패키지이다. vue init webpack은 사용자가 직접 원하는 설정을 지정해 프로젝트를 만들지만 3.0버전은 이 과정이 생략된다. 2) ..

- 22 동계 대학생 S/W 알고리즘 특강 사전문제 1. JAVA언어로 알고리즘 3문제 풀이 시작 2. 난이도 자체는 어렵지 않아 보이는데 해설이 너무 장황해서 이해하는데 시간이 걸렸다..

최대공약수를 활용하여 대각선으로 선이 그어진다면 선에 겹치는 영역을 제외한 나머지 정사각형들의 개수를 구하는 문제이다. - 첫 시도시 최대공약수가 아닌 w와 h의 크기별로 비교를 하여 해결하려 했는데 44.4에서 정답률이 올라가지 않아 최대공약수를 사용해 해결하였다. def check(w, h): # w와 h중 max=a, min=b a, b = max([w, h]), min([w, h]) while True: # 최대 공약수 구함 r = a % b # 최대공약수를 구한다면 return b if r == 0: return b # b에는 현재 r의 결과값이 들어가있으므로 max의 값은 필요없고 b의 min값을 비교해야함 a = b # r의 현재 값을 b에 넣어줌 b = r def solution(w,h):..

도메인 연결 - 내 도메인.한국 에서 무료 도메인 구매 - IP연결 : 퍼블릭 ipv4로 AWS 서버와 연결 - 웹 포워딩에서 연결하고 싶은 도메인 주소 입력(www.noolim.kro.kr) —> 퍼블릭 DNS서버:포트번호 - AWS 서버까지 도메인 서버로 바꾸려면 페이를 지불해야함 HTTPS 설정 SSL/TLS인증서는 ACM이나 NGINX를 통해 또는 외부 사이트를 활용해 인증서를 발급받을 수 있다. ACM(AWS Certificate Manager)을 통해 인증서를 발급받는 방법을 선택했음 *.도메인주소 를 통해 www의 요청을 받을 수 있고 *.을 제외하고 도메인주소 만으로도 연결될 수 있게 두가지를 설정 설정 한 뒤 Route 53에서 레코드 생성까지 완료해야 Route 53와의 연결까지 끝 —..