https://school.programmers.co.kr/learn/courses/30/lessons/136798 프로그래머스SW개발자를 위한 평가, 교육, 채용까지 Total Solution을 제공하는 개발자 성장을 위한 베이스캠프programmers.co.kr 문제 설명숫자나라 기사단의 각 기사에게는 1번부터 number까지 번호가 지정되어 있습니다. 기사들은 무기점에서 무기를 구매하려고 합니다.각 기사는 자신의 기사 번호의 약수 개수에 해당하는 공격력을 가진 무기를 구매하려 합니다. 단, 이웃나라와의 협약에 의해 공격력의 제한수치를 정하고, 제한수치보다 큰 공격력을 가진 무기를 구매해야 하는 기사는 협약기관에서 정한 공격력을 가지는 무기를 구매해야 합니다.예를 들어, 15번으로 지정된 기사단원은 ..

Hyper Text Transfer Protocol의 약자로, HTML과 같은 하이퍼미디어 문서를 전송하기 위한 애플리케이션 계층의 프로토콜이다. 쉽게 말해 서버와 클라이언트 간에 데이터를 주고 받기 위해 사용되는 통신 규약이라고 이해하면 된다.  문서뿐 아니라 이미지, 영상, 파일, JSON, XML 등 거의 모든 형태의 데이터를 전송할 수 있어 대부분 HTTP 프로토콜을 사용하여 통신을 한다.  HTTP 통신은 클라이언트(Frontend)와 서버(Backend)로 단이 나뉘어 클라이언트가 요청(request)을 하면 서버가 이에 대한 응답(response)을 보내주는 방식으로 동작한다. 💡 URL에서의 http예를 들어 http://www.cotato.kr 라는 인터넷 주소가 있다면, www.cot..

브라우저 저장소는 브라우저에서 데이터를 클라이언트 측에 저장하기 위한 기술이다. 이를 통해 웹 애플리케이션은 서버와 상호작용하지 않고도 데이터를 저장하고 관리할 수 있다. 브라우저 저장소의 종류는 Web Storage와 Cookie 두 가지로 나뉘고, Web Storage는 Local Storage와 Session Storage로 나눌 수 있다.  Web Storage웹 데이터를 클라이언트에 저장하기 위한 key-value 형태의 저장소로, Cookie의 단점을 보완하고자 HTML5에 추가된 스펙이다.저장된 데이터는 클라이언트(브라우저)에 존재할 뿐 서버로 전송되지 않는다. 따라서 네트워크 트래픽에 영향을 주지 않는다.쿠키에 비해 용량 제한이 넉넉하다. (서버로 전송되지 않고 그저 클라이언트 측에 데이터..

MPA와 SPAMPA(Muliple Page Application)새로운 페이지를 요청할 때마다 서버에 정적 리소스를 요청ex.JSP, PHP SPA(Single Page Application)모든 정적 리소스를 최초 한 번에 다운로드ex. React, Vue, Next, Nuxt 🤷🏻‍♂️ MPA는 SSR, SPA는 CSR?일반적으로 MPA는 SSR, SPA는 CSR 방식을 많이 사용하나, 고정된 규칙은 아니다. 예외가 되는 사례들을 살펴보자. - SSR을 사용하는 SPANext.js는 기본적으로 SPA임에도 불구하고, SSR과 CSR을 혼합한 하이브리드 렌더링 방식을 사용한다. - CSR을 사용하는 MPA일부 MPA는 초기 HTML을 서버에서 제공하고, 나머지 상호작용을 위해 JavaScript를..

1주차-문자열덧셈계산기-레포지토리 프리코스 1주차 미션을 진행하며 신경 쓴 부분, 그리고 그 과정에서 배우고 느낀 점들을 작성해보려 한다.   구현할 기능 설계 및 정리우선 나는 프리코스 목표로 '구현에 앞서 문제에 대한 적절한 해결 방안을 설계하는 연습하기'를 다짐하였기 때문에 냅다 생각나는 대로 코드를 짜는게 아니라 문제를 요구사항과 함께 충분히 분석하고 설계하는 과정에 투자를 많이 하려고 하였다. 💡 설계입력 받은 문자열에 대해 인덱스를 증가시키며 한 자씩 읽으면서, case별로 함수를 만들어 처리한다./가 나올 경우, +4자리까지 읽어서 커스텀 구분자의 지정 형식에 맞는지 확인한다.숫자가 나오면 배열에 넣어놓고, 그 다음 자리를 확인하여 숫자면 다시 배열에 넣는다.숫자가 아닌 문자가 나오면 구분..

Reflow와 Repaint 브라우저의 렌더링 과정에서 렌더 트리가 생성된 후, 뷰포트를 기반으로 요소(노드)들의 위치, 크기 등을 계산하는 과정을 Layout 단계, 이를 바탕으로 화면에 요소들을 픽셀화하여 그리는 과정을 Paint 단계라고 한다.(브라우저의 렌더링 과정에 대해 더 자세히 알고 싶다면 여기를 참고) Reflow는 Layout과,Repaint는 Paint와 연관되어 있는데, 쉽게 말해 Reflow는 레이아웃이 변경되었을 때, 각 요소들의 위치나 크기 등을 다시 계산하는 과정이고, (변경 시 영향을 받은 모든 노드의 수치를 계산 -> 렌더트리 재생성) Repaint는 Reflow가 일어나고 화면을 다시 그리는 과정을 말한다.  Reflow와 Repaint가 발생하는 시점Reflow 발생 예..