자바스크립트는 동적으로 타입을 결정하는 언어로, 변수를 선언할 때 타입을 명시하지 않는다. 이러한 특성 때문에 자바스크립트는 원시타입과 참조타입 두 가지 종류의 데이터 타입을 제공한다. 원시, 참조 타입 1. 원시 타입(Primitive Type) 1. 원시 타입 종류 숫자(number) 문자열(stri...

Javascript와 Proptotype JavaScript 객체 지향 언어이다. 객체지향언어로는 java, python, rudy등이 있는데 객체지향에서 빠질 수 없는 개념은 class다. Class를 통해 상속받아 코드를 재활용할 수 있다. 하지만 javascript에는 클래스 개념이 존재하지 않아 prototype을 기반으로 상...

자료구조란 컴퓨터가 데이터를 효율적으로 구성, 저장하고, 처리, 조작을 하기 위한 방법을 의미한다. 예를 들어, 만약에 우리가 숫자를 컴퓨터에 저장하려고 한다면, 자료구조를 사용해서 이 숫자를 어떤 방식으로 저장하고 처리할지를 정할 수 있다. 자료구조의 종류에는 대표적으로 배열(Array), 링크드 리스트(Linked List), 스택(Stack)...

Next.js 프레임워크의 동작원리에서 Hydrate는 중요한 개념이다. Next.js는 서버 사이드 렌더링, 정적 웹 페이지 생성 등 리액트 기반 웹 애플리케이션 기능들을 가능케 하는 오픈 소스 웹 개발 프레임워크로 React(CSR)의 단점을 보안하기 위해 같이 사용되곤 한다. Hydrate를 이해하기 위해 먼저 React(CSR)와 Nex...

Report 페이지 기능 1. 선택한 파일에서 진행한 분석 종류를 select로 선택할 수 있다. 초기값 = Preprocess 2. select에서 선택한 분석 종류의 결과지를 보여준다. 분석 종류가 변경될 때마다 각 분석에 해당하는 결과지를 가져와야 한다. 🖥️ 적용 화면 Report 페이...

예전에는 프론트엔드가 복잡하지 않아 프론트엔드 테스트를 잘 진행하지 않았다. 그러나 프론트엔드의 중요성이 강조되고, 백엔드의 다양한 기능들이 프론트엔드로 옮겨오면서 프론트엔드가 점점 더 중요해지고, 프론트엔드를 관리 할 필요성이 생기기 시작했다. 이렇게 프론트엔드 관리와, 프론트엔드 코드의 퀄리티의 중요성이 대두 되면서 프론트엔드 테스팅도 같이 주...

프론트엔드 개발자가 UI/UX를 알아야하는 이유? 요즘 가장 많이드는 생각은 “내가 일을 잘하는 것일까?”, “일을 잘하는 것의 기준은 뭘까?” 이다. 스타트업에서 사수없이 일하려다 보니 많은 고민이 생긴다. 그래서 다른 사람들이 생각하기에 프론트엔드 업무 잘하는 사람은 어떤 사람인지 찾아보다가 가장 공감되는 부분을 찾았다. 시니어 개...

React-Query란? 리액트 애플리케이션에 데이터를 불러오고 캐싱하며, 서버 데이터와의 동기화 및 업데이트 하는 작업을 개발자가 쉽고 간단하게 할 수 있도록 도와주는 라이브러리이다. 사용 목적 서버로부터 받아오는 데이터를 관리하기 위해 서버 상태 관리를 위한 라이브러리를 찾아보았다. 검색 결과 대부분 redux...

SWR과 React-Query SWR 먼저 캐시에서 데이터를 반환한 다음, 서버에 데이터를 가져오는 요청을 보내고, 마지막으로 최신 데이터를 제공하는 전략이다. React-Query 리액트 애플리케이션에 서버 상태를 가져오고, 캐싱하고, 동기화하고, 업데이트하는 것을 쉽게 해준다. 사용 목적 서버로부터 받아오는 ...