본문 바로가기
728x90
반응형

전체 글58

[Codestates FE] S3U4 - Redux Redux의 데이터 흐름, FLUX 패턴 Redux 전역 상태를 관리해주는 상태 관련 라이브러리이다. Flux Pattern MVC 패턴의 문제를 해결하기 위해 Facebook이 발표한 Flux Pattern은 Action, Dispatcher, Store, View 순서로 동작하는 단방향 데이터 흐름을 가진 디자인 패턴이다. Client-Side 웹 애플리케이션을 만들기 위해 사용하는 디자인 패턴으로, 데이터 변화를 훨씬 예측하기 쉽게 만든다. Redux가 상태 관리하는 순서 상태가 변경되어야 하는 이벤트가 발생하면, 변경될 상태에 대한 정보가 담긴 Action 객체가 생성됨 이 Action 객체는 Dispatch 함수의 인자로 전달됨 Dispatch 함수는 Action 객체를 Reducer 함수로 전.. 2023. 4. 24.
[Codestates FE] 블로깅 챌린지 1주차 - CORS 🖌 velog에 CORS라는 검색으로 포스트를 찾으면 약 6126개의 포스트가 나온다. 기본적인 개념이긴 하지만, 개발을 시작한 사람이라면 누구나 만나봤을 개념이다. 대학교 3학년 때, React.js와 Node.js로 프로젝트를 진행했었는데 개발 경험이 전무했던 우리 팀은 이게 뭔지도 몰랐다. 그저 구글에 에러 메시지를 검색해서 StackOverflow에 계신 많은 전문가분들의 도움을 받곤 했다. Proxy 등의 방법으로 해결해본 경험은 몇 번 있지만, 기술 면접을 위해 개념부터 탄탄하게 정리하고자 한다. SOP의 탄생 클라이언트는 브라우저를 통해 URL 주소로 누군가가 만들어 놓은 웹사이트를 이용했다. 누구나 데이터를 요청하고 응답할 수 있었다. 하지만 이러한 방식은 보안의 문제점이 존재한다. 해커가.. 2023. 4. 21.
[Codestates FE] S3U2 - UI/UX UI UI(User Interface, 사용자 인터페이스)는 사람들이 컴퓨터와 상호 작용하는 시스템이다. 화면상의 그래픽 요소 외에도, 키보드, 마우스 등의 물리적 요소도 UI이다. CLI(Command Line Interface, 명령 줄 인터페이스) : 터미널 GUI(Graphical User Interface, 그래픽 사용자 인터페이스) : 화면과의 상호작용을 통해 사용하는 인터페이스 UX UX(User Experience, 사용자 경험) : 사용자가 어떤 시스템, 제품, 서비스를 직간접적으로 이용하면서 느끼고 생각하는 총체적 경험이다. UI와 UX의 차이점 UX는 UI를 포함한다. 2023. 4. 13.
[Codestates FE] S2U8 - REST API ## REST API REST API는 웹에서 사용되는 데이터나 자원을 HTTP URI로 표현하고, HTTP 프로토콜을 통해 요청과 응답을 정의하는 방식을 말한다. ## REST API 성숙도 모델 성숙도 모델은 총 4단계로 나누어져서 각 단계의 조건에 만족할 수록 REST API에 가까워진다고 한다. ### Level 0 Level 0은 웹 매커니즘을 사용하지 않고 HTTP를 원격 호출을 위한 전송 시스템으로 사용하는 경우이다. RPC(Remote Procedure Call)처럼 리소스 구분 없이 설계된 HTTP API이다. 하나의 End-point를 사용해서 HTTP Method도 반드시 POST가 된다. 그래서 서로 다른 매개변수를 통해서만 여러 동작을 하게 된다. ### Level 1 : Reso.. 2023. 3. 29.
[Codestates FE] S2U5 - 반딧불반 App.js import React from 'react'; import './App.css'; import './global-style.css'; import { BrowserRouter, Routes, Route, Link } from 'react-router-dom'; import Sidebar from './Sidebar'; import Tweets from './Pages/Tweets'; import MyPage from './Pages/MyPage'; import About from './Pages/About'; const App = () => { return ( ); }; // .. 2023. 3. 23.
[Codestates FE] S2U2 - 객체 지향 프로그래밍 객체 지향 프로그래밍 단순히 별개의 변수와 함수로 순차적으로 작동하는 것을 넘어, 데이터의 접근과 데이터의 처리 과정에 대한 모형을 만들어 내서, 데이터와 기능이 별개로 취급되지 않고, 한 번에 묶여서 처리할 수 있게 되었다. 캡슐화 데이터와 기능을 따로 정의하지 않고, 하나의 객체 안에 넣어서 묶는 것 => 느슨한 결합 (코드가 상징하는 실제 모습과 닮게 코드를 모아 결합함) 코드가 복잡하지 않게 만들고, 재사용성을 높임 추상화 사용하는 사람이 필요하지 않은 메서드 등을 노출시키지 않고, 단순한 이름으로 정의함 코드가 복잡하지 않게 만들고, 단순화된 사용으로 변화에 대한 영향을 최소화함 상속 부모 클래스 (기본 클래스)의 특징을 자식 클래스(파생 클래스)가 물려받는 것 불필요한 코드를 줄여 재사용성을 .. 2023. 3. 15.
728x90
반응형