본문 바로가기

공부50

[JS] N까지의 수의 합 다시 코딩테스트 공부를 시작하면서, N까지의 수를 합을 구하는 공식이 있다는 것이 생각났다. 검색하면 많은 좋은 글이 나오는 내용이지만, 내 머릿속에 남기기 위해서 블로깅을 하기로 결정했다. 1 ~ N 까지의 합을 구하는 공식 = N(N + 1) / 2 // 1 ~ N까지 합을 구하는 공식 N * (N + 1)/2 공식은 정말 간단하다. 그렇다면 왜 이렇게 풀이가 되는 것일까? 삼각형을 생각하기 1부터 4까지의 합을 구해야한다고 가정한다. 이 문제를 그림으로 그리면 왼쪽과 같이 표현할 수 있다. 검정 원들을 보면 검정 원의 모음이 삼각형을 그리게 되는 것을 알 수 있다. 삼각형의 넓이를 구하는 공식을 기억해보자. 삼각형의 넓이 = 높이 x 밑변 / 2 따라서 1 ~ N까지의 합이 N(N + 1) / 2가.. 2023. 6. 8.
기존 CRA 프로젝트에 TypeScript 추가하기 메인 프로젝트를 진행 중, CRA로 이미 프로젝트 초기 구성을 해 놓은 상태에서 TypeScript를 사용하는게 어떻냐는 의견이 나왔다. 아직 prettier, eslint 정도만 설정해 놓았기 때문에 새로 CRA를 만드는 것이 편했지만, 이번 기회에 기존의 CRA에 TS를 추가해보기로 했다. ✨ CRA DOC 참고하기 CRA Doc는 매우 친절하게 모든 것을 알려주기 때문에, 꼭 궁금한 것이 있으면 찾아보는 것을 추천한다. https://create-react-app.dev/docs/adding-typescript/#installation Adding TypeScript | Create React App Note: this feature is available with react-scripts@2.1... 2023. 3. 7.
[web] 브라우저의 구조 ✨브라우저의 주요 기능 사용자가 선택한 자원을 서버에 요청하고 브라우저에 표시하는 것 자원은 보통 HTML 문서지만 PDF, 이미지 또는 다른 형태일 수 있다. 자원의 주소는 URI에 의해 정해진다. ✨ 브라우저의 기본 구조 사용자 인터페이스 주소 표시줄, 이전/다음 버튼, 북마크 메뉴 등. 요청한 페이지를 보여주는 창을 제외한 나머지 모든 부분들 브라우저 엔진 사용자 인터페이스와 렌더링 엔진 사이의 동작을 제어한다. 렌더링 엔진 요청 받은 내용을 브라우저 화면에 표시하는 일을 한다. ex) HTML을 요청 시, HTML과 CSS를 파싱해 화면에 표시한다. 대표적으로 파이어폭스가 사용하는 게코Gecko, 사파리가 사용하는 Webkit, 크롬이 사용하는 Blink가 있다. 통신 HTTP 요청과 같은 네트워.. 2023. 1. 16.
[web] OAuth HTML 삽입 미리보기할 수 없는 소스 OAuth 참고 자료OAuth 개념 및 동작 방식 이해하기OAuth 란 무엇일까 MDS인텔리전스 블로그 : 네이버 블로그 [OAuth2] 권한 부여 방식의 종류 ( Authorization Grant ) OAuth - 위키백과, 우리 모두의 백과사전 ✨ OAuth란? RFC6749 인터넷 사용자들이 비밀번호를 제공하지 않고 다른 웹사이트 상의 자신들의 정보에 대해 웹사이트나 애플리케이션의 접근 권한을 부여할 수 있는 공통적인 수단으로서 사용되는, 접근 위임을 위한 개방형 표준 - wiki 즉, 다른 웹사이트 상 정보(구글, 페이스북 등..)를 웹 사이트나 어플리케이션에게 접근 권한을 부여할 수 있는 공통적인 방법이다. Jumpit 로그인 버튼들 사용자는 어플리케이션.. 2023. 1. 9.
[js] ~ tilde와 ~~ double tilde 프로그래머스 코딩테스트를 풀면서 다른 사람들의 코드를 많이 접하게 됬는 데, 그 중에서 ~~를 사용한 코드를 보고 ~ Bitwise Not (~) 연산자에 대해 정리해보기로 했다. ✨ ~ 연산자 비트를 반전 시킨다. 다른 비트 연산자와 마찬가지로 연산 전에 부호가 있는 32비트 정수로 변경한 후 연산을 진행한다. 자바스크립트는 숫자를 표현할 때, 64 bit 부동소수점 방식을 사용한다. 그러나 모든 비트연산들은 연산 전에 32비트 정수로 변환하고 비트 연산을 진행한다. 연산이 끝난 후, 다시 64비트로 변환한다. ✨ ~를 하나만 쓰는 경우 ~N은 -(N+1)을 반환한다. const a = 5; // 0000 0000 0000 0000 0000 0000 0000 0101 const b = -3; // 11.. 2023. 1. 8.
[web] 쿠키의 동작 해당 글은 web.dev의 SameSite 쿠키 설명 글을 제가 이해하기 쉬운 방향으로 다시 정리한 글 입니다. 원본 글을 읽으시는 걸 추천합니다. 🍪 쿠키란? 웹 사이트를 방문했을 때, 웹 브라우저를 통해 사용자의 로컬 환경에 설치되는 작은 기록 정보 파일 HTTP 프로토콜에 속한다. 서버가 보내주는 데이터이다. 🍪 쿠키를 사용하는 경우 세션 관리 서버에서 저장해야하는 세션 정보를 관리한다. 민감한 정보 X. ex) 세션ID 개인화 사용자 선호, 테마 등을 관리한다 사용자 트래킹 사용자의 행동을 기록하고 분석 🍪 first-party 및 third-party 쿠키 first-part 쿠키 현재 사이트의 도메인, 브라우저 주소 표시줄에 표시되는 도메인과 일치하는 쿠키를 first-party 쿠키라고한다... 2023. 1. 6.