코드스테이츠

시맨틱이란 ‘의미가 있는, 의미론적인'이라고 해석따라서 시멘틱 태그는 의미가 있는 태그 SEO 최적화에 유리검색 엔진이 태그 목적에 맞게 설계된 사이트에서 더욱 빨리 효율적으로 파악 할 수 있어 검색 결과의 노출에 유리하게 해줌!웹 접근성에 효율적시각 장애인을 위한

console.log() 첫번째와 두번째가 같은 동작을 하는데 혼동했다.reduce의 initialValue 사용하자!오랜 적이였던 reduce와 친해졌다reduce로 많은 걸 할 수 있다. 배열에서 가장 긴 문자열 구하기 정도reduce를 이해해서 기분이 좋다.후기

➡️ Promise 생성자 함수는 비동기 처리를 수행할 콜백 함수를 인수로 전달 받는다.➡️ 이 콜백 함수는 resolve와 reject 함수를 인수로 전달 받는다.➡️ Promise 생성자 함수가 인수로 전달 받은 콜백 함수 내부에서 비동기 처리 수행➡️ 비동기 처리

2023.01.25\-> Single Page ApplicationHTML 문서 전체가 아니라 업데이트에 필요한 데이터만 받아, JS가 이 데이터를 조작하여 HTML 요소를 생성하여 화면에 보여주는 방식!서버로부터 완전한 새로운 페이지를 불러오지 않고 페이지 갱신에 필

2020.01.26컴포넌트의 사용 중 컴포넌트 내부에서 변할 수 있는 값props는 외부로부터 전달 받은 값state는 내부에서 변화하는 값Props : 이름, 성별 (불변)State : 나이, 취업 여부(변하는 값)컴포넌트의 속성(property) 의미외부로부터 전달

Endpoint(root-endpoint, root-URL)API로 요청을 서버와 통신할 때, 서버가 요청을 수락하는 시작 점과제에서는 http://3.36.72.17:3000path(url-path)서버와 통신할 수 있는 key 역할(서버에 정의된 문자열에

React 16.8에 추가된 요소, 기존 Class 바탕의 코드를 작성할 필요 없이 상태 값과 여러 React의 기능을 사용할 수 있다.Hook은 함수 컴포넌트에서 React state와 생명주기 기능을 연동 할 수 있게 해주는 함수❌ class 안에서 동작하지 않는다

UI는 사람들이 컴퓨터와 상호 작용하는 시스템을 의미사용자와 서비스나 제품의 상호작용과 의사소통을 원활하게 해주는 접점에 존재하는 것. 사용자가 보게 되는 디자인, 레이아웃 등을 아우르는 개념.GUI 사용자가 그래픽을 통해 컴퓨터와 정보를 교환하는 작업 환경사용자가 편

CDD : 컴포넌트 주도 개발부품 단위로 UI 컴포넌트를 만들어 나가는 개발기본적인 컴포넌트 단위에서 UI View까지 상향식 조립 개발같은 UI 컴포넌트 공유재사용할 수 있는 UI 컴포넌트⛔️ 등장 배경 : 프로젝트가 규모나 복잡도 상승 시 CSS를 작성하는 일관된

두 개의 배열(base, sample)을 입력받아 sample이 base의 부분집합인지 여부를 리턴해야 합니다.시간 복잡도를 개선하여, Advanced 테스트 케이스(base, sample의 길이가 70,000 이상)를 통과해 보세요.

chapter1: 웹 표준 ~ chapter2: SEO웹 표준을 알기 전 알야할 웹🤔 인터넷은 웹 기반으로 작동한다. ( ❌ )인터넷은 전 세계적으로 연결되어 있는 컴퓨터 네트워크 통신망 의미!(웹, 온라인 게임, 이메일 등 네트워크를 사용하는 다양한 서비스들을 모두

chapter3. 웹 접근성일반적으로 웹 접근성은 장애인, 고령자 등이 웹 사이트에서 제공하는 정보에 비장애인과 동등하게 접근하고 이해할 수 있도록 보장하는 것을 뜻함웹 접근성의 궁극적인 목적은 어떤 상황이든, 어떤 사람이든 정보를 제공받지 못하는 경우가 없도록하는 것

src 폴더 내부에 componets, pages 폴더를 추가하였다.https://styled-components.com/docs/basicsCSS in JS 라이브러리 : Styled Components 설치1\. npm install --save style

너비를 먼저 탐색하는 방법을 Breadth-First Search, 너비 우선 탐색이라고 합니다깊이를 먼저 탐색하는 방법을 Depth-First Search, 깊이 우선 탐색이라고 합니다.1부터 시작하는 DFS : 1->2->6->3->8->7->4->51부터 시작하는

웹 브라우저라고도하고, 웹 탐색기라고도 불린다.웹 서버에서 양방향으로 통신하며 HTML 문서 및 그림, 동영상 등의 컨텐츠를 열람할 수 있게 해주는 GUI 기반의 소프트웨어 프로그램페이지 다운로드 하기 위해 HTTP를 통해 송수신인터넷상에서 텍스트나 그림, 소리, 영상

여러 장치의 다양한 특성에 대응하는 하나의 웹 문서 또는 사이트로써 브라우저의 크기(스크린, 디바이스 종류)에 실시간으로 반응하여 크기에 따라 레이아웃이 변하는 웹 사이트를 의미하나의 소스 코드로 모든 스크린에 최적화된 웹 사이트를 구축할 수 있는 방법론디바이스 종류에

프론트엔드 개발자에게 번들링이란?사용자에게 웹 애플리케이션을 제공하기 위한 파일 묶음작성한 HTML, CSS , JS 그대로 전송하면 특별한 상황에 문제가 생길 수 있다.두 개의 .js 파일에서 같은 변수를 사용하고 있어서, 변수 간 충돌이 일어날 때딱 한 번 불러오는

✅ Virtual DOM React는 UI의 상태를 추적하고 변화가 일어난 요소들을 빠르게 업데이트할 수 있도록 Virtual DOM이라는 가상의DOM 객체를 활용한다. Virtual DOM이 나오게 된 배경 > Virtual DOM은 Real DOM의 가벼운 사본과

Custom Hooks개발자가 스스로 커스텀한 훅을 의미, 반복되는 로직을 함수로 뽑아내어 재사용여러 url을 fetch할 때, 여러 input에 의한 상태 변경 등 반복되는 로직을 동일한 함수에서 작동하게 하고 싶을 때 커스텀 훅을 주로 사용상태 관리 로직의 재활용

컴퓨터는 하드웨어와 소프트웨어가 합쳐진 형태하드웨어 : 전자 회로 및 기계 장치로 되어 있어 입출력 장치, 중앙처리장치(CPU), 기억 장치 등으로 구성소프트웨어 : 하드웨어 위에서 하드웨어를 제어하며 작업을 수행하는 프로그램컴퓨터는 입력 장치, 출력 장치가 갖춰져 있

오픈 소스로 제공된 쿼리 언어.API를 위한 쿼리 언어그래프는 여러 개의 점들이 서로 복잡하게 되어 있는 관계를 표현한 자료 구조🤔 그래프 자료 구조와 트리 구조의 차이 이미지GraphQL에서는 모든 데이터가 그래프 형태로 연결되어 있다고 전제.GraphQL은 클라이

-> GitHub GraphQL이 제공하는 Explorer ✅ 사용법 밑은 링크를 통해 해당 explorer에 접속 https://docs.github.com/en/graphql/overview/explorer 로그인 배운 GraphQL 쿼리를 이용하여 자신이 만

dangerouslySetInnerHTML

TDD(Test-driven Development)는 코드를 작성하기 전에 테스트를 쓰는 소프트웨어 개발 방법론\-> 개발자 자신이 바람직하다고 생각하는 코드의 결과를 미리 정의하고, 이것을 바탕으로 코드를 작성하는 법\-> 작은 단위의 테스트 케이스를 작성하고, 이

최적화, 最適化, optimization주어진 상황에서 원하는 가장 알맞은 결과를 얻을 수 있도록 처리하는 과정.최적화는 허용된 자원의 한계 내에서 주어진 요구사항을 만족시키면서 최선의 결과를 얻는 과정이다. 수익과 관련되는 분야에서는 이익을 최대로 내는 과정을 말하기

GitHub Actions는 GitHub에서 제공하는 CI/CD (Continuous Integration/Continuous Deployment) 및 일반 작업 자동화 도구입니다. 이를 사용하면 저장소를 기반으로 코드를 빌드, 테스트, 배포하는 프로세스를 자동화할 수

04_DP 금고를 털어라🖥️ 문제자신이 감옥에 간 사이 연인이었던 줄리아를 앤디에게 빼앗겨 화가 난 조지는 브레드, 맷과 함께 앤디 소유의 카지노 지하에 있는 금고를 털기로 합니다. 온갖 트랩을 뚫고 드디어 금고에 진입한 조지와 일행들. 조지는 이와중에 감옥에서 틈틈

useEffect가 하는일은 무엇일까요?\-> useEffect Hook을 이용하여 우리는 React에게 컴포넌트가 렌더링 이후에 어떤 일을 수행해야하는 지를 말한다.\-> React는 우리가 넘긴 함수를 기억했다가(이 함수를 ‘effect’라고 부릅니다) DOM 업데

브랜칭(branching)은 기존 개발중인 메인 개발 코드를 그대로 복사하여 새로운 기능 개발을 메인 개발 코드를 건드리지 않고 할 수 있는 버전 관리 기법main브랜치에서 작업을하다 새로 기능 개발시 feature 브랜치를 새로 생성하는 경우, 기존 main 브랜치에

다른 origin이 요청과 응답을 할 때 필요한 설정(ex) localhost:3000과 localhost:4000HTTP는 stateless(무상태성)인데 어떻게 우리의 정보가 유지 될까요?\-> 쿠키를 사용해서 가능웹 사이트 방문 시, 서버 -> 클라이언트에 전달하

.env 파일Login.js