TIL wecode

일단 모든 태그들은 처음에 position: static으로 설정되어 있다. 그러므로 따로 써주지 않아도 된다. 이 상태에서는 왼쪽에서 오른쪽, 위에서 아래로 쌓이게 된다.보통 static은 사용할 일이 없으나 앞에 설정된 position을 무시할 때 사용되기도 한다.

사전적 정의를 본다면 '의미론적인 웹'이다. 바로 단순한 코드의 나열이 아니라 의미를 가진 웹이라는 뜻이다. 이렇게 만들고자 하는 이유는 인터넷 상의 방대한 데이터를 컴퓨터가 자동으로 해석해 사용자가 원하는 결과값을 주기 위해서이다. 예를 들면 google이나 nave

for each... "for each...in" iterates a specified variable over all values of the specified object's properties. For each distinct property, a specifie

array : 배열(array)은 JavaScript 객체의 특수한 형태로써, 객체의 프로퍼티명이 0부터 시작해서 순차적으로 커지는 자연수로 이루어진 형태라고 생각할 수 있습니다. 이를 통해 어떠한 데이터를 순차적으로 저장하거나 조회하는데 유용하게 사용된다. arra

: 객체(Object)란 단지 이름이 지정된 프로퍼티의 모음이며, 키(key) : 값(value)의 쌍으로 이루어진 목록이다. 어레이와 가장 크게 구분지을 수 있는 것은 오브젝트에는 순서를 가지고 있지 않다는 점이다.{} 중괄호를 이용한다..: 프로퍼티의 이름을 알 때

객체 지향 프로그래밍과 Class 생성자(Constructor) 인스턴스(Instance) 메서드(Method)

reduce

undefinednullboolean (true/false)숫자문자열객체 (object)typeof는 말그대로 아이템의 데이터 타입을 알아볼 수 있는 연산자이다. typeof로써 나올 수 있는 값은 다음과 같다."undefined""boolean""string""num

링크로 이동

1. flex-direction 부모 요소에서 사용하는 것으로, 자식 요소의 정렬 방식에 대해서 변경한다. flex-direction: row; (기본값) 자식 요소가 가로로 마크업 순서대로 왼쪽을 기준으로 정렬된다. flex-direction: row-reverse;

The <input> tag specifies an input field where the user can enter data.<input> elements are used within a <form> element to declare input con

버전 관리 도구를 넘어서서 협업을 할 때 편리하게 만듬. 깃허브는 깃을 인터넷에서 관리하게 만든 중앙 시스템 만약 깃허브가 없다면? 서버를 하나 만들어서 올려야 한다. 깃은 로컬 환경에 있음, 깃허브는 중앙 시스템임.

리액트는 페이스북에서 만든 자바스크립트 라이브러리이고, UI와 front-end application을 구축하는데 사용된다.리액트는 그 behavior와 capability 때문에 프레임워크라고 불리기도 한다. augular, view js 등의 프레임워크는 route

자료구조란 데이터에 편리하게 접근하고 조작하기 위해서 데이터를 저장하거나 조직하는 방법입니다. 이 자료구조를 이용하면 적절한 구조에 상황과 문맥에 맞게끔 데이터를 담을 수 있기 때문에 굉장히 효율적으로 사용 가능합니다.모범 답안 )자료 구조란 데이터의 편리한 접근과 조

가장 큰 특징은 순차적으로 데이터를 저장한다는 것이다. 그렇기 때문에 각 요소가 인덱스를 가지고 있고 이 인덱스로 요소에 접근할 수 있다. 주로 서로 연결된 데이터들을 순차적으로 저장할 때 사용하게 된다.삽입하는 순서대로 데이터가 저장된다.이미 만들어진 array(li

동일 코드가 반복되는 부분을 하나의 comopnent로 만들어 재사용 가능한 UI 단위.하나의 컴포넌트에 필요한 html, css, js를 모두 합쳐서 만들 수 있다.독립적이고 재사용이 가능하다는 점에서 함수와 비슷한데, props라는 input을 받아서 React 요

props vs state props는 사용자가 컴포넌트를 사용하는 입장에서 중요한 것이고, state는 props의 값에 따라서 내부의 구현에 필요한 데이터라고 생각할 수 있다. 컴포넌트의 기본적인 동작을 바꾸고 싶을 때 사용자에게 제공하는 것이 props이다. 이

Data Structure 1. Set array나 list와 같은 순열 자료구조이지만 순서 개념이 없다. 동일한 값을 삽입할 수 없고 만약 동일한 값이 들어온다면 하나의 값만 저장된다. 수정 가능하다. 단방향 데이터이다. 그래서 한 번 암호화 하면 복호화가 되지 않

constructor render componentDidMount componentDidUpdate

Variables Nesting ![](https://images.velog.io/images/jjo-niixx/post/f78df6d6-8f3e-40d5-b64d-059cb35fd381/%E1%84%89%E1%85%B3%E1%84%8F%E1%85%B3%E1%84%8

1\. 배경 이미지 소스로 URL과 전체 사이즈를 가져온다.2\. 내가 추출할 아이콘 이미지의 크기를 지정한다.3\. 여기서 1행의 아이콘은 양의 y축, 2행의 아이콘은 음의 y축을 가진다. 그리고 1열의 아이콘은 x축의 0부터 시작한다.4\. 내가 추출할 이미지의 크

Pagination 목록형 UI에서 데이터를 한 번에 가져오는 것이 아니라 필요한 만큼, 또는 화면에 보이는 만큼만 백엔드에 요청하고 응답받아 사용하는 방식. 예를 들어 인스타그램을 본다면 하단의 스크롤로 내려왔을 때 로딩이 되는 것을 볼 수 있다. 바로 그 때 새로운

Amazon Web Services의 줄임말로 Amazon 사의 클라우드 컴퓨팅 플랫폼Cloud Storage Flatform - EBS, S3Per Hour Billingb - 사용 시간 단위 계산간단한 가입 프로세스별도의 하드웨어 없이 서버를 띄울 수 있음Amazo

Database 데이터를 저장, 연산 및 보존하는 시스템 데이터베이스와 메모리는 반대되는 개념. 메모리는 휘발성. 데이터를 메모리에 저장한 후, 컴퓨터를 종료하면 데이터가 날아가버린다. 메모리의 장점은 속도. 그래서 저장은 데이터베이스에 넣어 영구적으로 보존하고 메모리

이번 프로젝트는 airbnb를 클로닝하는 프로젝트인데 난 거기서 메인 페이지 & 로그인 및 회원가입을 맡게 되었다. 로그인 및 회원가입은 이메일, 구글을 통해 진행되는 것으로 나뉘는데 소셜 로그인을 한 번도 다루어 보지 않아 정리하며 익혀 보려고 한다.Create au

Create authorization credentialGoogle API Console로 이동Create credentials > OAuth cliend IDWeb application 어플리케이션 타입을 선택OAuth 2.0 클라이언트의 이름을 짓고 Create 클

Redux를 쓰는 이유 > "Single source of truth" 진실은 하나의 근원으로부터 리덕스를 사용하면 상태 관리를 컴포넌트 바깥에서 관리할 수 있게 된다. 액션 (Action) 액션을 발생시킴으로서 상태에 어떠한 변화를 일으킬 수 있습니다. 액션은 객

현재 하는 프로젝트에서 서울시의 생활인구 데이터를 시각화하는 역할을 맡고 있다. 계획으로는 D3, recharts 등과 같은 툴을 이용하여 해당 지역의 시간에 따른 성별 및 연령대에 따른 생활인구의 변화를 나타내고 싶다.

리액트에서 D3 사용하기D3 라이브러리를 설치해주고 필요한 메소드를 임포트 시켜 준다.업데이트 시킬 데이터를 state에 설정해둔다.useRef() 를 사용하여 Ref 객체를 만들고, 이 객체를 특정 변수에 정의하여 나중에 사용하기 쉽도록 하자.Ref 객체의 .curr

1. D3 세팅 2.Data 세팅 및 useRef 설정 ![](https://images.velog.io/images/jjo-niixx/post/915337f4-12d5-407d-9160-e2767111ae61/%E1%84%89%E1%85%B3%E1%84%8F%E1%

미들웨어는 리듀서가 액션을 처리하기 전에 실행되는 함수디버깅 목적으로 상탯값 변경 시 로그를 출력하거나, 리듀서에서 발생한 예외를 서버로 전송하는 등의 목적미들웨어를 설정하지 않으면 dispatch한 액션은 곧바로 리듀서로 보내진다대표적인 리덕스 미들웨어로 redux-

자바스크립트 객체를 콘솔에 입력한 후 JSON.stringify() 메소드를 활용하면 json 형식으로 손쉽게 변환할 수 있다.이때 필요한 JSON.stringify() 메소드를 알아보자.JSON.stringify(value\[, replacer, space])valu

Expo is a framework and a platform for universal React applications. It is a set of tools and services built around React Native and native platforms

JWT (Json Web Token)

이러한 오류 상황을 맞게됨.

정규식 리터럴(슬래쉬"/"로 감싸는 패턴)을 사용하거나 RegExo 객체의 생성자 함수를 호출해서 정규 표현식을 만들 수 있다.MDN으로 확인하기