분류 전체보기

(23.08.02 ~ 23.08.17) Socket.io를 활용해서 실시간 스터디 서비스를 만들다. *기능 구현 정리 목차 3으로 이동* * 프로젝트 깃허브 https://github.com/2023-AISCHOOL-JSA/LegendA-CoreProject 우리 조의 핵심프로젝트 주제는 "개발 입문자를 위한 실시간 스터디 서비스"이다. 나는 프로젝트에서 Back-end로 사용자 간의 실시간 통신을 담당해서 전체적인 실시간통신, 채팅방 생성, 채팅 기능을 담당했다. 그래서 실시간 통신을 할 때 사용되는 webSocket을 독학하기로 했다. 1. WebSocekt, Socket.io 배우기 * webSocket, socket.io 강의 https://nomadcoders.co/noom/lobby webSo..

클래스 컴포넌트의 생성부터 소멸까지 이르는 일련의 과정인 Life Cycle을 배우다. 1. Life Cycle (그림 1) Life Cycle은 React의 클래스 컴포넌트의 생성부터 소멸까지 이르는 일련의 과정이다. 이것을 활용해서 컴포넌트가 생성되는 각 과정에서 실행되는 함수를 이용해서 내가 원하는 시점에서 원하는 동작을 하도록 구현이 가능하다. (그림 2) Life Cycle의 과정은 3단계가 있다. 컴포넌트가 생성되는, 컴포넌트가 화면에 처음 그려지는 상태인 Mounting, 컴포넌트가 생성되고 난 후 props, state, force Update의 변화가 생겨서 렌더링, 리렌더링 될 때, 부모 컴포넌트가 갱신이 되었을 때를 가리키는 Updating, 컴포넌트가 화면에서 사라진 상태인 UnMo..

독립 변숫값을 변형시켜 가면서 함수의 최솟값을 갖도록 하는 독립변수를 구하는 방법인 경사하강법을 배우다. 1. 경사하강법 정의 MSE를 구하는 2 번째 방법인 경사하강법을 배우겠다. 사용할 모델은 sklearn.linear_model의 SGDRegression모델을 사용할 것이다. 경사하강법은 똑같이 MSE가 최소가 되게 하는 최적의 w(기울기)와 b(절편) 값을 찾는 방법이다. 기계가 스스로 학습한다는 딥러닝의 개념이 있게 하는 핵심 알고리즘이다. 원리는 우리가 시각화했던 그래프를 보면 MSE가 최솟값으로 가야 한다. 그럼 접선의 기울기가 0이 되어야 하기 때문에 기울기가 작아지는 쪽으로 계속 이동하여 값을 최적화하는 방법이다. 기울기가 양수이거나 음수인 건 상관이 없다. 그냥 절댓값이 0에 가까울수록..

지도학습의 회귀 모델 중 하나인 선형회귀 모델을 배우다. 1. 선형 회귀 선형 회귀는 통계학적으로 보면 데이터 값이 평균과 같은 일정한 값으로 돌아가려는 경향을 이용한 통계학 기법이다. 예를 들면 사람의 키는 부모, 조부모의 평균 키로 회귀하려는 경향을 가진다 (자연의 법칙). 머신러닝 관점으로 보면, 여러개의 독립변수(문제)와 한 개의 종속변수(정답) 간의 상관관계를 모델링하는 기법으로 사용된다. 시간에 따라 변화하는 데이터나 영향, 가설적 실험, 인과 관계 모델링 등에서 자주 사용된다. 수치적 가치를 추정. 2. 선형 모델 우리는 회귀 모델중 선형 회귀 모델을 배울 것이다. 그렇다면 선형 모델은 무엇일까? 선형 모델은 입력 특성에 대한 선형 함수를 만들어 예측을 수행하고 다양한 선형모델을 사용할 수 ..

컴포넌트 간에 state를 공유할 수 있게 해주는 Context를 배우다. 1. Context ? 리액트는 상위 컴포넌트에서 하위 컴포넌트로 데이터가 이동하는 단방향 전달 방식(그림 1)이다. 우리가 지금까지 실습했을 때는 컴포넌트의 계층구조가 단순했다. 많아야 3층이었는데, 실제로 프로젝트를 진행하게 되면 컴포넌트의 구조가 복잡해지고 계층이 많아지는 현상이 생길 수밖에 없다. 여태 배운 개념만으로는 예를 들어 5층에 있는 컴포넌트에 최상위 컴포넌트의 state를 전달하기 위해서는 하위 컴포넌트에 props로 하나하나 전달해주는 방법밖에 없다. 이런 현상을 Prop Drilling이라고 한다. 그리고 state의 이름을 변경하면 또 하나 하나 props의 이름을 바꿔줘야 하는 번거로움이 있기 때문에 Co..

컴포넌트 내에서 데이터를 저장하는 공간인 useRef를 배우고 기본변수, state, ref의 차이점을 배우다. 1. Ref Ref를 사용하는 이유 기존에 컴포넌트 내에서 데이터를 저장하기 위해 state를 사용했다. 하지만 state는 값이 변함에 따라 리렌더링 된다는 단점이 있다. 리렌더링이 되면 컴포넌트에서 사용된 내부 변수가 초기화돼버린다. 리렌더링 되더라도 변수가 초기화되지 않는 것이 필요한 것이다. 이것을 해결해 주는 것이 바로 Ref이다. Ref 특징 Ref로 데이터를 관리하면, Ref의 값이 변하더라도 컴포넌트가 리렌더링이 되지 않아서 불필요한 리렌더링 현상이 줄어들어 성능 저하를 방지한다. Ref로 데이터를 관리하는 컴포넌트가 state에 의해 리렌더링 되더라도 기본 변수와는 다르게 값이..

배열에서 특정 조건에 해당하는 요소만 새로운 배열로 만들어주는 filter 함수를 배우다. 1. filter 함수 설명 filter함수는 map함수와 동일하게 배열에 사용할 수 있는 함수이다. map처럼 배열 내 요소들을 하나씩 함수 내 콜백함수를 거치게 하는데, map과는 다르게 filter함수는 조건을 걸어서 해당 조건을 만족하는 배열 내 요소들만 추출해서 새로운 배열을 반환한다. 1 - 1. map과 filter의 차이 let new_array = members.map((member) => member.task === "Front-end") console.log(new_array); let age_27 = members.filter((member) => member.age < 27) console...

데이터가 많을 때 사용하는 특성 선택을 배우다. 1. 특성 선택의 정의 특성 선택이란 데이터가 많은 상황에서 사용한다. 데이터가 많은 상황에선 특성이 다양하기 때문에 어떤 특성이 의미있는 데이터인지 구별해서 시간을 단축시켜야할 필요가 있다. 특성 선택을 하지않고 모델을 학습시키면 학습량이 늘어나면서 시간 소요가 늘어나 성능이 저하된다. 모델이 규칙을 찾는데에 도움이 안되는 데이터가 들어가기 때문에 불필요한 데이터가 발생한다. 특성 선택의 목표는 불필요한 데이터를 제거하고 필요한 데이터만 남기는 것이다. 2. 특성 중요도 feature_importances_ 특성 선택 과정에선 사용되는 특성들의 중요도를 확인해서 중요도가 1에 가까울수록 중요한 특성으로 생각하면 된다. 특성 중요도를 반환하는 함수를 사용하..