실제 성능 및 체감되는 성능을 향상시키는 방법을 이해하기 위해서 브라우저가 어떻게 동작하는지 이해해야 한다.

UI / Front-end develop info.

Project와 App의 차이

Django에서 웹 서비스 각각의 기능은 앱 단위로 구현한다. 실제로 하나의 프로젝트는 여러 개의 앱과 약간의 설정 파일들로 구성되어 있고 하나의 앱은 여러 개의 프로젝트에서 사용할 수 있다.

diango 개발환경 구성하기

1. Homebrew를 설치후 버전을 확인한다.

   1	/bin/bash -c "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/HEAD/install.sh)"

   1	brew --version

   MORE

Next.js를 사용하는 이유

• 프리 렌더링
• Vercel로 서버 호스팅
• 파일 시스템 기반 서버 호스팅

npx create next app .으로 설치한다.

1. node.js를 설치한다.
2. npm i next 명령어를 진행한다.
3. npm i react react-dom 을 설치한다.

https://thebook.io/ 에서 참고할 수 있다.

• create-react-app으로 리액트 프로젝트 생성.
  npm init react-app <폴더 이름> 혹은 해당 폴더 안에 들어간 후 터미널에서 npm init react-app .
• 개발모드 실행: npm run start
• 개발모드 종료: Ctrl + C
• 리액트 개발자 도구: React Developer Tools (크롬 확장 프로그램)

객체 지향 프로그래밍

• 컴퓨터 프로그래밍의 패러다임 중 하나이다. 객체 지향 프로그래밍은 컴퓨터 프로그램을 명령어의 목록으로 보는 시각에서 벗어나 여러 개의 독립된 단위, 즉 “객체”들의 모임으로 파악하고자 하는 것이다. 각각의 객체는 메시지를 주고받고, 데이터를 처리할 수 있다. ¹
• ‘객체’는 ‘속성’들과 ‘동작’들의 묶음이라고 할 수 있는데 속성은 ‘변수’로 나타내고, 동작은 ‘메소드(함수)’로 나타낸다.

  [ 1 ] : 위키백과

배열을 사용하면 변수 하나에 값을 여러개 담을 수 있다.

if

1
2
3
4
5
6
7
8
9

if (조건부분 1) {
    // 수행 부분 1
} else if (조건 부분 2) {
    // 수행 부분 2
} else if (조건 부분 3) {
    // 수행 부분 3
} else {
    // 수행 부분 4
}

변수

• 변수의 이름과 변수의 자료형을 선언해주어야 한다.
• [ 자료형(data type) ] [ 변수의 이름 ]
• int: x가 어떤 자료형을 저장할지

  1 2	int a; // 정수형 변수 String s; // 문자열 변수