키모스토리

타입스크립트란?타입스크립트(TypeScript)는 자바스크립트의 슈퍼셋인 오픈소스 프로그래밍 언어이다. 마이크로소프트에서 개발, 유지하고 있으며 엄격한 문법을 지원한다. C#의 리드 아키텍트이자 델파이, 터보 파스칼의 창시자인 아네르스 하일스베르(Anders Hejlsberg)가 개발에 참여한다. 클라이언트 사이드와 서버 사이드를 위한, 프론트백 통합 개발에 사용할 수 있다. 타입스크립트는 자바스크립트 엔진을 사용하면서 커다란 애플리케이션을 개발할 수 있게 설계된 언어이다. 자바스크립트의 슈퍼셋이기 때문에 자바스크립트로 작성된 프로그램이 타입스크립트 프로그램으로도 동작한다. 타입스크립트에서 자신이 원하는 타입을 정의하고 프로그래밍을 하면 자바스크립트로 컴파일되어 실행할 수 있다. 타입스크립트는 모든 운영..

https://axios-http.com/ AxiosPromise based HTTP client for the browser and node.js Axios is a simple promise based HTTP client for the browser and node.js. Axios provides a simple to use library in a small package with a very extensible interface.axios-http.comAxios란?Axios는 node.js와 브라우저를 위한 Promise 기반 HTTP 클라이언트 입니다. 그것은 동형 입니다(동일한 코드베이스로 브라우저와 node.js에서 실행할 수 있습니다). 서버 사이드에서는 네이티브 node.js의 htt..

디렉토리 구조 (JavaScript 버전)/src├── app/│ ├── store.js # Redux store 설정│ ├── hooks.js # Custom hooks (useAppDispatch, useAppSelector)│├── features/ # 기능(도메인)별 상태 및 컴포넌트 관리│ ├── auth/ # 인증 관련 기능│ │ ├── authSlice.js # Redux Slice│ │ ├── authAPI.js # API 요청 관리 (RTK Query 또는 fetch/axios)│ │ ├── AuthPage.js # 관련 페이지 컴포넌트│ │ └── components/ # 관련 UI 컴포넌트│ │ ..

https://redux-toolkit.js.org/ Redux Toolkit | Redux ToolkitThe official, opinionated, batteries-included toolset for efficient Redux developmentredux-toolkit.js.org1. Redux Toolkit이란?Redux Toolkit(RTK)은 Redux의 공식 권장 도구로, Redux를 더 쉽고 효율적으로 사용할 수 있도록 도와줍니다.Redux의 기존 단점을 개선하여 보일러플레이트 코드 감소, 비동기 로직 간소화, 더 나은 개발자 경험을 제공합니다.주요 특징configureStore() : Redux 스토어 설정을 단순화createSlice() : 액션과 리듀서를 함께 정의 가능crea..

1. Flux 패턴이란?Flux는 Facebook이 만든 단방향 데이터 흐름(One-way Data Flow) 아키텍처 패턴으로, React 애플리케이션에서 상태 관리를 단순화하고 예측 가능하게 만드는 데 사용됩니다.🔹 특징단방향 데이터 흐름 유지명확한 역할을 가진 4가지 핵심 요소상태(State)를 중앙에서 관리애플리케이션의 예측 가능성을 높임2. Flux 패턴의 주요 구성 요소Flux는 총 4가지 핵심 요소로 구성됩니다.① Action (액션)사용자의 입력이나 외부 이벤트를 기반으로 발생하는 이벤트 객체예: 버튼 클릭, API 요청 응답📌 예제 (액션 생성 함수)const addTodo = (text) => { return { type: "ADD_TODO", payload: text ..

https://react-bootstrap.netlify.app/ React Bootstrap | React BootstrapThe most popular front-end framework, rebuilt for Reactreact-bootstrap.netlify.app 리액트 프로젝트 개발시 디자인 작업을 편리하게 해주는 프레임워크 설치npm install react-bootstrap bootstrap 사용방법1. App.js파일에 css import import 'bootstrap/dist/css/bootstrap.min.css'; 2. 디자인 요소가 필요한 js 파일에서 각각의 필요한 bootstrap 컴포넌트를 import 하여 사용import React from 'react';import Bu..