Single Page Application의 가장 큰 특징으로 페이지 진입시 리소스를 한번에 다운을 받아서 자연스러운 페이지 전환을 시켜 준다는 것이다. 하지만 프로젝트의 규모가 커지면 커질 수 록 리소스 다운로드에 많은 시간이 소요되어서

사용자가 컴퓨팅 자원을 직접 구입해서 사용하는 것이 아닌 빌려서 사용하는 개념으로 이전에는 단순 컴퓨팅 자원에 대해 클라우드 컴퓨팅이라는 용어를 썼지만 점차 ICT전체를 아우르기 시작하면서 클라우드 서비스라는 개념으로 발전했다.대표적인 예시로, 네이버 MYBOX(구 N

Yarn Brray > yarn 버전 2 > ✅ .zip를 활용하여 압도적으로 적은 용량 사용. ✅ zero-install 레포지토리를 생성할 수 있게 된다. ✅ 사전에 module 의존성 트리를 만든다 ✅ npm의 비효율적인 의존성 검색을 개선 ✅ 환경에 따라 달라지는 동작 제어 ✅ 프로젝트 빌드 환경을 개선시키기 위해 Zero insta...

모듈페더레이션 과정주에 리모트 요소들 hot reloading 안되는 문제발생 wepack5 Module Federation과정중에 host 앱의 hot-reloading는 자동으로 반영이 되지만 expose앱들의 hot-reloading은 반영이 되지 않아서 개발시

url에 VueRouter 4 버전 이상부터는, createRouter, createWebHashHistory 함수를 이용하여 라우터를 생성하고, 생성된 Vue App 에서 use 로 사용할 수 있다.history의 모드를 createWebHashHistory() 대신

자바스크립트로 개발하다보면 코드의 재사용이나 유지보수 측면에서 파일을 여러개로 분리해서 개발하곤 한다.이렇게 분리된 파일을 “모듈“ 이라고 한다이랗게 웹앱이 완성이 되면 웹서버에 배포를 하게 되고 사용자들이 웹서버를 통해서 브라우저에 접근을 하게 되면브라우저는 사용자에

서비스의 규모가 커지면 커질수록 앱에 들어가는 피처들이 많아지고 피처들 사이의 의존성이 생기기 마련이다.이런 의존성을 제거하기 위해 공통적으로 사용할 것들을 (ex. 컴포넌트 단위 혹은 서비스 단위)를 독립적으로 구현해 놓고 앱에서 불러와 사용하곤 하는데분뤼된 각각의

Micro Front-ends라는 용어는 2016년 말에 ThoughtWorks Technology Radar에서 처음 등장했다. 마이크로 서비스의 개념을 프론트엔드 세계로 확장한 것으로 오늘날에는 기능이 풍부하고 파워풀한 브라우저 어플리케이션 즉 마이크로 서비스 아키

객체 객체는 상태(state)를 나타내는 프로퍼티와 동작(behavior)을 나타내는 메서드를 하나의 논리적인 단위로묶은 복합적 자료구조이다. 동작을 나타내는 메서드는 자신이 속한 객체의 상태, 즉 프로퍼티를 참조하고 변경할 수 있어야 한다. 이때 매서드가 자신이 속

npm install -g @vue/cli 기존 프로젝트에서 사용하던 node.js와 버전이 맞지 않아서 vue3를 설치할수없는 문제 발생So, 프로젝트 마다 다른 버전을 설정해주는 번거로움을 피하기 위해서 node.js 가상환경 설정을 통해 해결 해준다.위 처럼 no

Install Atlassian에서 만든 React DND 라이브러리 react-beautiful-dnd를 사용해 안전하게 dnd를 구현해보자. 타입스크립트를 사용한다면 위의 방식 두가지를 통해서 설치를 해준다. > 📕 공식 문서 : https://github.

🚩 CDN의 등장배경 데이터 통신기술이 발달하면서 세계적으로 수많은 데이터들이 전송되는 세상이되었다. 기하급수적으로 증가하는 데이터르르 최대한 지연 없이 효율적으로 전달하기 위해 CDN이라는 기술이 등장했다. 👩‍🏫CDN은 무엇일까? CDN은 Content

Single Page Application의 약자로 하나의 페이지로 구성된 웹 어플리케이션이다.웹 어플리케이션에 필요한 모든 정적 리소스를 최초 한번에 다운로드 하고, 그 이후에 새로운 페이지 요청이 있을 때 페이지 갱신에 필요한 데이터만 전달받아서 페이지를 구성한다.

데이터를 차곡차곡 쌓아 올린 형태의 자료구조입니다. 조금 더 설명하자면, 위의 사진과 같이 데이터가 순서대로 쌓이며 가장 마지막에 삽입된 자료가 가장 먼저 삭제되는 구조를 가지고 있습니다.

✅ 개발스택 Frontend : Javascript, Next.js, React-Query, Recoil, Styled-components Backend : Django, Python, MySQL, AWSS3 Desgin : Figma, Zeplin, Illustr

01\. 물류 처리에 있어 사람이 개입되면서 발생하게 되는 다양한 오류에 대한 해결 방안을 제안해주세요.02\. 상품별 적정가를 모니터링 할 수 있는 해결 방안을 제안해주세요.03\. 컬리 고객들에게 적합한 상품을 추천할 수 있는 아이디어를 제안해주세요.04\. 위의

Next.js 시작하기 next.js를 설치 해준 뒤 터미널에서 cd로 해당 디렉토리로 이동 이렇게 하면 개발 서버가 3000번 포트에서 돌아가고 있을 것이며, http://localhost:3000/에서 확인할 수 있다.

👩‍🏫 Typescript >타입스크립트(TypeScript)는 자바스크립트(JavaScript)를 기반으로 정적 타입 문법을 추가한 프로그래밍 언어이다. 컴파일 언어, 정적 타입 언어 👉 코드 작성 단계에서 타입을 체크해 오류를 확인할 수 있고 미리 타입을

🛫 OURTRIP 🌴 프로젝트 소개 Myrealtrip을 참조하여 Ourtrip이라는 항공권 예매 웹사이트를 구현하였다. 1. 팀원소개 Front-end 손가영, 윤경연, 유하은, 최현민 Back-end 정병휘, 최바다 2. 프로젝트 기간 🕒 2022.0

리액트 아이콘위와 같이 사용하고자 하는 아이콘이름을 {}안에 넣어주면 된다.다시 리액트 홈페이지로 가서 원하는 아이콘을 선택해주면 자동으로 컴포넌트 이름이 복사가 된다.react icons를 import하고 복사한 컴포넌트를 넣어주면 된다. 만일 원하는 아이콘 컴포넌트