본문 바로가기

Frontend

(290)
TIL 23.08.02 Mockterview (1)~(3) 1. 시간복잡도와 공간복잡도는 무엇인가 ? 둘 다 알고리즘 성능 평가시 사용되는 개념이다. 시간복잡도 : 시간 복잡도란 알고리즘의 절대적인 실행시간이 아닌, 알고리즘을 실행하는데 연산들이 몇 번 이루어지는지 숫자로 표기한 것이다. 공간복잡도 : 프로그램을 실행시킨 후 완료하는 데 필요로 하는 자원 공간의 양을 뜻한다. 그러나 예전에 비해 컴퓨터 성능이 발달하여 메모리 공간에 여유가 생겨 중요도는 떨어졌다. 시간 복잡도와 공간 복잡도는 반비례적인 성향이 있다. 2. 스택과 큐는 무엇인가? 스택 : 웹 브라우저의 뒤로가기 처럼 가장 늦게 쌓인 데이터가 가장 빨리 나가는 후입선출의 자료구조이다. 큐 : 입력된 데이터가 시간 순서대로 처리해야 할 필요가 있는 상황에 사용되며, 가장 먼저 들어간 데이터가 제일 처..
[AWS] 클라우드 서비스 종류 IaaS (Infrastructure as a Service) 하드웨어 인프라를 인터넷을 통해 제공하는 서비스로, IaaS 는 가상화된 하드웨어, 스토리지, 네트워크, 운영체제 등을 제공한다. 사용자는 이를 통하여 자신의 애플리케이션을 실행 가능. 예) AWS EC2, Microsoft Azure, Google Computer Engine PaaS (Platform as a Service) 애플리케이션을 개발, 실행, 관리하기 위한 플랫폼을 인터넷을 통해 제공하는 서비스. PaaS 는 IaaS 에서 제공하는 하드웨어 인프라와 미들웨어를 사용하며, 애플리케이션 개발, 배포, 운영 등에 필요한 환경을 제공한다. 예) AWS Elastic Beanstalk, Heroku, Google App Engine Sa..
TIL 23.08.01 로컬스토리지 데이터 저장/ 조회/ 삭제 로컬스토리지에 데이터 저장하기 localStorage.setItem(key, value) import React, { useState } from 'react'; function App() { const [data, setData] = useState(''); const handleInputChange = (event) => { setData(event.target.value); }; const handleSaveData = () => { localStorage.setItem('myData', data); // 키-값 형태로'myData'라는 키로 데이터를 로컬 스토리지에 저장 }; return ( Save Data ); } export default App; 로컬스토리지에서 데이터 가져오기 localS..
[React] Redux Ducks 패턴 1. Reducer 함수를 export default 2. Action Creator 함수를 export 3. Action Type 은 app/ reducer/ Action_Type 형태로 작성 모듈 파일 한개에 Action Type, Action Creator, Action Value 가 모두 작성된 방식
[React] Redux 프로젝트 세팅 Redux 프로젝트 생성 yarn add redux react-redux src > redux > config > configStore.js // 중앙 데이터 관리소 (store) import { createStore } from "redux"; import { combineReducers } from "redux"; const rootReducer = combineReducers({}); const store = createStore(rootReducer); export default store; src > index.js import React from "react"; import ReactDOM from "react-dom/client"; import "./index.css"; import App ..
TIL 23.07.31 Redux thunk/ toolkit 개념정리 Redux thunk Redux thunk 는 리덕스에서 비동기 작업을 하기 위한 미들웨어 중 하나로, Redux thunk 를 사용하면, 액션 생성자 함수가 일반 객체뿐만 아니라 함수도 반환할 수 있다. Thunk의 장점 1. 비동기 작업 처리 Redux 는 동기적인 상태관리 라이브러리이므로, 액션은 순수한 객체 형태를 지닌다. 그러나 서버로부터 데이터를 가져오거나, API를 호출하는 비동기 작업은 리덕스에서 바로 처리가 불가능하다. 따라서 Redux Thunk를 사용하면 비동기 작업을 보다 쉽게 처리가 가능하다. 2. 분리된 비동기 로직 비동기 작업을 컴포넌트에서 직접 처리하면, 해당 컴포넌트가 너무 많은 역할을 하게 된다. 따라서 Redux Thunk를 이용해 비동기 로직을 액션 생성자 함수와 분리..
TIL 23.07.28 Redux 개념정리 Redux 1. 전역 상태관리 라이브러리 2. 주로 React 와 함께 Vue, Angler 에서도 사용할 수 있다. 3. Redux 는 애플리케이션의 상태를 단일한 "store" 에 저장하여 상태 변경 및 관리를 예측 가능한 방식으로 함. Redux 가 해결하려고하는 문제 1. 상태관리의 복잡성 해소 애플리케이션의 상태관리는 주로 props 로 이루어지는데 (useState를 통한 관리), 애플리케이션이 커지고 복잡해질수록 상태 흐름을 파악하기 어려움. Redux는 전역상태에서 통합적으로 관리가 가능함 (접근 : useSelector , 제어 : useDispatch) 2. 데이터 흐름의 일관성 유지 Redux는 상태변경을 예측 가능한 Action 객체로 관리한다. 3. 상태변경 로직의 중앙집중화 리..
[팀 프로젝트] 나는 어떤 공주일까? 나는 어떤 공주일까? 성격유형에 따른 공주의 관광지 추천 테스트 https://outsourcing-gongju.vercel.app/