로그인을 구현하면서 유효성 검사에 대해 알게되었다. 아직 개발 어린이인 나는 유효성검사를 알지 못했고 이번 기회에 유효성 검사에 대해서 공부하게 되었다!공부하면서 알게된걸 오늘 끄적여 볼 생각이다.사용자가 폼 페이지에서 입력한 데이터 값이 서버로 전송되기 전에 특정 규
Unit Test 유닛 테스트란, 내가 작성한 코드의 가장 작은 단위인 함수를 테스트하는 메소드이다. 그래서 내가 작성한 로직 을 테스트하는 유닛테스트 코드를 짜서 테스트하게 된다 프론트의 경우 버튼을 추가해서 이벤트를 처리하는 신규 로직을 구현랑 때마다 크롬 브라우
Rebase Git에서 한 브랜치에서 다른 브랜치로 합치는 방법으로는 두 가지가 있다. 하나는 Merge 다른 하나는 Rebase이다. 왜 Merge가 아닌 Rebase를 사용해야 하는가? Git Merge problems 불필요한 merge commit 생성 모
styled-component란 Css in JS라는 기술이다.말 그대로 이 기술은 JS안에 Css를 작성하는 것을 의미한다. styled-component는 현존하는 CSS in JS 관련 리액트 라이브러리 중에서 가장 인기 있는 라이브러리이다.사용하기 위해 styl
AWS는 Amazon Web Service의 줄임말이다.AWS는 소위 클라우드 서비스라고도 한다. 클라우드 서비스는 서버 등의 인프라스트럭쳐를 필요한대로 on demand로 사용할 수 있는 서비스이다.즉, 유저가 직접 서버를 구입하고 설치할 필요 없이 AWS상에서 클릭
리액트 컴포넌트는 클래스형 컴포넌트와 함수형 컴포넌트로 나뉜다.기존의 개발방식은 일반적으로 함수형 컴포넌트를 주로 사용하되 state이나Life Cycle method를 사용해야 할 때에만 클래스형 컴포넌트를 사용하는 방식이었다이유는 클래스형 컴포넌트가 함수형 컴포넌트
컴포넌트에서 유동적인 데이터를 다룰 때, state를 사용한다. React.js 어플리케이션을 만들 땐, state를 사용하는 컴포넌트의 갯수를 최소화 하는 것을 노력해야한다. 예를들어 10개의 컴포넌트에서 유동적인 데이터를 사용 하게 될 땐, 각 데이터에 state를
props는 컴포넌트에서 사용 할 데이터 중 변동되지 않는 데이터를 다룰 때 사용된다.parent 컴포넌트에서 child 컴포넌트로 데이터를 전할 때 props가 사용된다.컴포넌트에서 immutable (변하지 않는) 데이터가 필요 할 땐, render()메소드의 내부
RESTful API > 1. API시스템을 구현하기 위한 아키첵처 중에 가장 널리 사용되는 형식 Graphql, GRPC, REST...etc Representational State Transfer 웹상에서 사용되는 여러 리소스를 HTTP URI로 표현하고 그
map은 callback 함수를 각각의 요소에 대해 한번씩 순서대로 불러 그 함수의 반환값으로 새로운 배열을 만듭니다.callback 함수는 배열 값이 들어있는 인덱스에 대해서만 호출된다.값이 삭제되거나 아직 값이 할당/정의되지 않은 인덱스에 대해서는 호출되지 않는다.
javascript에서 Http요청을 보낼때는 fetch함수를 사용한다.fetch함수는 첫번째 인자로 http 요청을 보낼 API주소, 두번째 인자로 요청을 보내때의 옵션들을 객체형태로 받는다.백엔드로부터 데이터를 받아오려면 api를 호출하고 데이터를 응답받는다.이 때
인증은 회원가입을 말한다.인증은 왜 필요할까\-우리 서비스를 누가 쓰는지? 어떻게 사용하는지? 추적이 가능하도록 하기 위해 필요하다.인증에 필요한 것은 무엇이 있을까?\-아이디, 이메일 주소, 비밀번호 등이 있다.비밀번호는 어떻게 관리해야할까?\-Database에 저장
SASS (syntactically awesome stylesheets)는 CSS pre-processor로서 CSS의 한계와 단점을 보완하여 보다 가독성이 높고 코드의 재사용에 유리한 CSS를 생성하기 위한 CSS의 확장이다.SASS의 장점css보다 심플한 표기법으로
Single Page Application (싱글 페이지 어플리케이션)의 약자이다. 말그대로, 페이지가 1개인 어플리케이션이란 뜻이다.유저가 요청 할 때 마다 페이지가 새로고침 되며, 페이지를 로딩 할 때마다 서버로부터 리소스를 전달받아 해석 후 렌더링을 한다.SPA의
React는 페이스북 에서 개발하고 관리하는 사용자 인터페이스를 만들기 위한 JavaScript 라이브러리다.리액트와 같은 프론트엔드 라이브러리 혹은 프레임 워크를 사용하는 가장 큰 이유중 하나는 UI를 자동으로 업데이트 해 준다는 점이다.리액트는 가상돔(Virtual
Refactoring이란? 외부 동작을 바꾸지 않으면서 내부 구조를 개선하는 방법이다. 코드가 작성된 후에 디자인을 개선하는 작업이다. 모든 것을 미리 생각하기보다는 개발을 하면서 지속적으로 좋은 디자인을 찾는다. 메소드 내의 지역변수와 parameter를 주의 깊게
Hyper Text Transfer Protocol의 약자이다.HTML문서와 같은 리소스들을 가져올 수 있도록 해주는 프로토콜이다.웹에서 이루어지는 모든 데이터 교환의 기초이며, 클라이언트-서버 프로토콜이기도 하다.Protocol : 컴퓨터 끼리 어떻게 HTML 파일을
컴퓨터 시스템에 저장된 정보나 데이터를 모두 모아놓은 집합을 의미한다.데이터들은 DBMS: Database Management System으로 제어 및 관리한다.1\. 데이터를 오랜기간 저장 및 보조하기 위해서작은 어플리케이션에서도 물론 데이터를 잠깐동안 임시로 저장할
position 속성HTML 요소가 위치를 결정하는 방식을 설정한다.top, right, bottom, left 속성이 요소를 배치할 최종 위치를 결정한다.정적 위치(static position) 지정 방식상대 위치(relative position) 지정 방식고정 위치
float속성은 해당 HTML요소가 주변의 다른 요소들과 자연스럽게 어울리도록 만들어준다.이 속성은 본래 위와 같은 목적으로 만들어졌지만, 현재는 웹 페이지의 레이아웃을 작성할때 자주 사용한다.float: left; 요소가 자신의 포함블록의 좌측에 부동해야 함을 나태는
display 화면에 어떻게 들어나게 할지 결정하는 속성이다. display
의미론적인 웹이란 뜻이다.의미론적인 웹은 말 그대로 컴퓨터가 웹사이트를 단순한 코드의 구성이 아닌 의미를 가진 사이트라는걸 알 수 있게 만드는 것이다.기계가 이해할 수 있는 형태로 제작된 웹을 의미한다.RDF: 웹상의 메타데이터의 표현과 교환을 위한 프레임워크XML:
월드 와이드 웹( World Wide Web )이란 인터넷에 연결된 사용자들이 서로의 정보를 공유할 수 있는 공간을 의미한다.간단히 줄여서 WWW나 W3라고도 불린다.웹은 인터넷 상에서 텍스트나 그림,소리,영상 등과 같은 멀티미디어 정보를 하이퍼텍스트 방식으로 연결하여
var, let, const 차이점var, let은 변수 선언시 초기 값을 주지 않아도 되지만 const는 반드시 초기값을 할당해야 합니다.var는 function-level scope이고, let,const는 block-level scoped이다.그럼 function
JavaScript 📏배열(Array)이란? 연관된 데이터를 모아서 통으로 관리하기 위해서 사용하는 데이터 타입이다. 변수가 하나의 데이터를 저장하기 위한 것이라면 배열은 여러 개의 데이터를 하나의 변수에 저장하기 위한 것이라고 할 수 있다. 🔄반복문(Loop
2012년 마이크로소프트가 발표한 TypeScript는 JavaScript를 기반으로 정적 타입 문법을 추가한 프로그래밍 언어이다.컴파일 언어, 정적 타입 언어JS는 동적타입의 인터프리터 언어로 런타임에서 오류를 발견할 수 있다.TS는 정적 타입의 컴파일 언어이며 타입