리액트 공부와 함께 하는 일상37 [TIL] 4주차 - 2. 웹 서비스 구조 / SQL / NoSQL 웹 서비스 구조 웹서비스는 Front-end 프로그램, Back-end 프로그램 그리고 DataBase로 이루어져있습니다. 그리고 이 구성으로 제작된 웹 서비스를 user는 Browser를 통해 이용하게 됩니다. 🔨 접속자가 적다면 한대에 이 세가지 프로그램을 다 설치해서 운영하는 것도 충분히 가능합니다. 접속자가 많아질 경우 각 접속자에 대한 메모리 할당량이 버거워질 수가 있어서 현대에 와서는 한 컴퓨터 당 하나의 프로그램을 설치하고 있습니다. 프런트엔드 서버 컴퓨터 백엔드 서버 컴퓨터 데이터 베이스 서버 이런 식으로 말입니다. 예를 들면 백엔드는 node.js 프런트는 next 데이터베이스는 postgres가 설치되어 있는 식입니다. 이 때, 서버라고 한다면 프로그램이 깔려서 24시간 동작하고 있는 .. 2022. 2. 7. [TIL] 4주차 - 1. 컴포넌트 생명주기 (feat. Class Component) Class class componenet 어떤식으로 구성되어 있을까요? 컴포넌트 사이클에 대해 알아보겠습니다. 자바스크립트는 객체지향 언어 입니다. 점 .을 하면 그 객체가 가지고 있는 함수, 변수를 사용할 수 있습니다. 위 사진에서 date는 Date() 객체에 대한 주솟값을 받아 .점을 통해 해당 객체의 함수를 사용하고 있습니다. 컴포넌트 역시 클래스로 만들어줄 수 있습니다. 클래스형 컴포넌트는 use ~ 이름을 가진 hooks는 사용할 수 없고 html을 표현하기 위한 render()함수가 필요합니다. class는 자바스크립트 ES6 에 나온 문법이고 이전에는 prototype 문법을 사용했습니다. 컴포넌트 선언 방식은 함수형 컴포넌트 와 클래스형 컴포넌트 이렇게 두가지가 있습니다. 이 둘의 특징을.. 2022. 2. 3. [TIL] 3주차 - 6. husky 설치 및 셋팅 Husky husky란 소스코드를 git에 commit 하기 전에, 기존의 규칙(typescript, eslint, prettier 등)을 지켜가면서 코딩을 진행하였는지 검증해 주는 도구입니다. 커밋하기 전에 허스키로 명령어를 가로채고 규칙에 어긋나는 코드가 있다면 commit을 강제로 거절합니다. 따라서, 실무적으로 더 안정적인 협업을 할 수 있습니다. ( 쉽게 말해서 그냥 라이브러리 설치하는 것인데 커밋 하기 전에 허스키로 명령어를 가로채고 eslint가 제대로 무사한지 보고 안무사하면 커밋을 못하게 하는 방식입니다. ) Husky 설치 및 셋팅 1. husky 설치 npm에 들어가 husky를 검색해줍니다. 2022년 1월 25일 기준 가장 안정되어 있는 버전은 4이므로 버전4로 설치 받도록 하겠습.. 2022. 1. 30. [TIL] 3주차 - 5. js의 객체, 배열 복사 / 무한스크롤 1. 객체 / 배열 복사 객체 또는 배열을 복사하는 법은 두 가지입니다. 얕은 복사 (Shallow Copy) 주소값을 복사합니다. 따라서 원본 값 또는 복사된 값을 변경하면 두 값 모두 변경 됩니다. 깊은 복사 (Deep Copy) 값 자체를 복사하여 새로운 주소로 넣어줍니다. 같은 주소를 공유하지 않으므로 참조를 공유하지 않게 됩니다. 전체를 문자열로 만든 뒤, 그 문자열을 객체로 돌리는 방식입니다. 이를 위한 메서드로 자바스크립트의 JSON.stringfy()와 JSON.parse() 를 사용합니다. JSON.stringfy() stringify 메소드는 json 객체를 String 객체로 변환시켜 줍니다. JSON.parse() parse 메소드는 string 객체를 json 객체로 변환시켜줍니다.. 2022. 1. 28. 이전 1 ··· 4 5 6 7 8 9 10 다음
