📌 웹 표준 웹 표준이란 W3C에서 권고하는 웹에서 표준적으로 사용되는 기술이나 규칙으로, 사용자가 어떠한 운영체제나 브라우저를 사용하더라도 웹페이지가 동일하게 보이고 정상적으로 작동할 수 있도록 하는 웹 페이지 제작 기법을 가지고 있습니다. 장점 유지 보수의 용이성 웹 호환성 확보 검색 효율성 증대 웹 접근성 향상 Semantic HTML 웹 표준에서는 HTML을 시맨틱하게 작성하는 것이 중요합니다. 시맨틱(semantic)의 뜻은 의미가 있는 이라는 뜻을 가지고 있습니다. 그래서 Semantic HTML은 HTML을 구조만 만드는 것이 아니라 의미까지 가지게 한다는 것입니다. 필요한 이유 개발자 간 소통에 용이 검색 효율성 증가 웹 접근성 자주 사용되는 Semantic 요소들 요소 종류 설명 페이지나..
🥯 애피타이저 RTK Query란? RTK Query는 웹 애플리케이션에서 데이터를 가져오는 상황을 간단하게 하여 data fetching과 cashing 로직을 직접 작성할 필요가 없도록 하는 강력한 data fetching, cashing 툴입니다. RTK Query는 Redux Toolkit를 설치하면 내장되어 있기 때문에 따로 설치를 하지 않아도 선택하여 사용할 수 있습니다. RTK Query를 왜 사용하나요? API 호출 및 데이터 관리와 관련한 boilerplate 코드를 대부분 처리가 가능하므로 더 적은 코드를 작성할 수 있습니다. 자체적으로 캐싱을 처리하고 불필요한 요청을 줄여서 애플리케이션의 성능을 향상합니다. 또한 백그라운드에서 백엔드 데이터를 프리로드하여 애플리케이션 로딩 속도를 빠르..
❓ 완전 탐색이란? 완전 탐색은 가능한 모든 해결 방법을 체계적으로 탐색하여 문제를 해결하기 위한 일반적인 접근 방식 또는 기술이라고 말할 수 있습니다. 완전 탐색이라는 특정 알고리즘이 따로 존재하는 것은 아니고, 이 접근 방식을 가지는 여러 종류의 알고리즘들의 큰 분류라고 할 수 있습니다. 👾 종류 브루트 포스 ( Brute Force ) 최적의 해결 방법을 찾기 위해서 가능한 모든 해결 방법을 확인하는 단순하고 직접적인 방식입니다. 단순히 조건문과 반복문을 이용할 수 있고, 좀 더 체계적으로는 순열과 조합의 접근 방식도 있습니다. 재귀 ( Recursion ) 재귀는 특정 조건이 충족될 때까지 함수가 반복적으로 자신을 호출하는 프로그래밍 기술입니다. 재귀 함수에서 함수는 일단 충족되면 재귀 호출을 중..
🥯 애피타이저 Redux란? Redux는 애플리케이션의 상태를 전역으로 관리하는 데 사용되는 오픈소스 JavaScript 라이브러리입니다. React와 함께 사용되기도 하지만, 다른 라이브러리나 프레임워크와도 사용할 수 있습니다. Redux를 사용하는 이유 하나의 Store를 이용하기 때문에 애플리케이션의 상태를 쉽게 추적하고 변경할 수 있고, Props Drilling을 방지하여 손쉬운 상태 전달과 업데이트가 가능하여 코드의 유지 보수성을 높이고 효율성을 극대화할 수 있습니다. 또한 미들웨어라는 기능을 제공하여 비동기 작업을 효율적으로 처리할 수 있습니다. Redux의 세 가지 원칙 Single source of truth 하나의 중앙 집중화된 Store에서 데이터를 관리합니다. State is rea..
❓OSI 7 계층이란? 네트워크에서 통신이 일어나는 과정을 7단계로 나눈 것입니다. 7 계층으로 나눈 이유 통신이 일어나는 과정을 단계 별로 파악할 수 있기 때문입니다. 특정한 단계에 이상이 생기면 다른 단계의 장비 및 소프트웨어를 건드리지 않고도 이상이 생긴 단계만 고칠 수 있습니다. 📣 계층 소개 1. 물리 계층 주로 전기적, 기계적, 기능적 특성을 이용해 통신 케이블로 데이터를 전송합니다. 데이터는 0과 1의 비트, 즉, on-off의 전기적 신호 상태로 이루어져 데이터를 전달만 할 뿐입니다. 데이터의 전달만을 담당하기 때문에, 데이터가 무엇인지, 오류가 있는지는 알 수 없습니다. 장비: 케이블, 리피터, 허브 2. 데이터링크 계층 물리적으로 연결된 인접한 두 장치 간의 신뢰성 있는 정보 전송을 담..
🚩 문제 주소 프로그래머스 코드 중심의 개발자 채용. 스택 기반의 포지션 매칭. 프로그래머스의 개발자 맞춤형 프로필을 등록하고, 나와 기술 궁합이 잘 맞는 기업들을 매칭 받으세요. programmers.co.kr 📄 접근 방법 배열 인덱싱 더보기 문제 설명이 너무 애매한 문제인 것 같다는 생각이 듭니다. 처음에는 문제에서는 순회하면서 인덱스를 보고 배열을 슬라이싱 한다는 느낌으로 해석해서 계속 틀렸습니다.. 전혀 모르겠어서 혼자 화만 내고 있었는데 동기분의 과감한 풀이 보기로 도움을 얻었습니다. 사실은 순회할 때 마다 슬라이싱 하지 않고, 잘라야 할 인덱스를 매번 갱신하여 마지막에 한 번에 슬라이싱 해야 했던 것입니다... 정말 어지러운 문제입니다.. 👨💻 나의 코드 function solution(a..
🚩 문제 주소 📄 접근 방법 그래프 탐색 - BFS 더보기 이 문제에 풀이 방법은 격자판이 주어지는 탐색 문제를 BFS로 푸는 흔한 풀이법과 거의 비슷합니다. 다른 부분은 방문 체크 배열을 확인만 하는 용도로 사용하지 않고, 현재 위치의 숫자에 1을 더한 숫자를 다음에 가야 하는 위치에 업데이트 하는 방식으로 사용합니다. 다음 위치의 숫자가 0이라면 방문한 적이 없는 것이므로 업데이트가 되지만, 0이 아니라면 방문한 적이 있는 것이므로 현재 위치 + 1 으로 값을 업데이트합니다. 👨💻 나의 코드 function solution(maps) { const moves = [[0,1],[0,-1],[1,0],[-1,0]]; const WIDTH = maps[0].length; const HEIGHT = map..
📌 조합 서로 다른 n개의 원소를 가지는 어떤 집합에서 순서에 상관없이 r개의 원소를 선택하는 것입니다. 기호로 나타내면 nCr 입니다. 예를 들어, 4C3를 직접 구해서 써본다면 아래와 같이 나옵니다. Input: [1,2,3,4] Output: [[1,2,3],[1,2,4],[1,3,4],[2,3,4]] 예시에서 볼 수 있듯이, 조합은 순서를 상관하지 않습니다. ( [1,2,3] = [3,1,2] ) 내부의 숫자가 같다면 그냥 같은 것으로 칩니다. 💦 풀이 과정 배열에서 순서대로 하나씩 선택하고, 나머지 원소들로 조합을 합니다. 나머지 원소들로 조합을 할때는 재귀를 사용하면 편합니다. 예시) [1,2,3,4] 선택 [1], 나머지 [2,3,4]에서 2개를 조합히면 [1,2,3],[1,2,4],[1,3..
