`Ctrl + Shift + C` 크롬, 파이어폭스, Edge에서 해당 단축키를 눌러도 개발자 도구가 잘 열린다.
라이트 테마 vs 다크 테마
·
WEB
https://brunch.co.kr/@bommade/33 왜 게임사이트는 다크 테마가 많을까?다크 테마의 장단점 제대로 알기 | 들어가며 최근에 꽤나 충격적(?)인 일이 있었다. 같이 사이드 프로젝트를 하던 기획자와 레퍼런스로 블라인드 앱을 이야기하다가 함께 앱을 켰는데 나는 블brunch.co.kr프로젝트 성격에 따라 다크 테마가 필요한 경우가 있고, 아닌 경우가 있다.위 글에 그 기준이 명확하게 잘 나와있는 것 같다.
스크립트 로드 방식에 따라 달라지는 코드의 효율 (with 폼 유효성 검사)
·
WEB
똑같은 폼 유효성 검사기를 구현한 두 가지의 코드가 있는데, 이 코드들의 효율을 두 가지 환경의 관점에서 분석해보았다.참고로 아래 [코드1]은 하나의 validators 객체 안에서 input id값별로 내부 메서드를 선언한 형태로,로그인이나 회원가입 페이지에서 모두 'validators' 하나만 import해서 각 input에 맞는 객체 내부 메서드들을 사용할 수 있다. [코드1]const validators = { userEmail: function (input) { if (input.value.trim().length === 0) { setInvalid(input, "이메일을 입력해주세요."); return false; } else if (!input.checkVali..
Status Code(상태 코드)
·
WEB
Status Code클라이언트-서버 구조에서 통신할 때, 요청에 대한 응답 상태를 간략하게 숫자로 표현하여 요청이 어떻게 처리되었는지 쉽게 파악할 수 있도록 알려주는 코드 Status Code의 종류 (ISRCS)1xx (Informational)2xx (Successful)3xx (Redirection)4xx (Client Error)5xx (Server Error) 흔히 쓰이는 상태 코드들200 OK: successful HTTP request201 Created: resource 생성 완료204 No Content: 요청은 성공적으로 이루어졌으나, return할 게 없음301 Moved Permanently: 리소스 위치가 변경되었을 때400 Bad Request: 클라이언트가 잘못된 요청을 보냈을..
서버와 클라이언트 간단 정리
·
WEB
클라이언트란?서버에게 서비스를 요청하는 것보통 '웹 브라우저'이다. (유저가 웹페이지에 접근하기 위해 상호작용하는) 클라이언트의 특징유저 인터페이스 역할서비스 요청 (서버에게)데이터 받기 (서버로부터) 서버란?서비스나 리소스를 주는 것 (클라이언트에게)클라이언트의 요청에 응답웹사이트를 호스팅함 서버의 특징항상 켜져있어야 함다수의 요청들을 다룸데이터 전달 (클라이언트에게) 둘의 통신 방식 1. 클라이언트가 서버에게 자원을 요청(request)2. 서버가 해당 요청을 받음3. 서버가 요청에 맞는 응답(response)을 전달4. 클라이언트가 응답을 받음 => 웹 브라우저 화면에 나타남
sessionStorage vs localStorage
·
WEB
sessionStorage와 localStorage는 둘 다 웹 스토리지 API의 일부로, 클라이언트 측에서 데이터를 저장하고 관리하는 데 사용됩니다. 그러나 몇 가지 중요한 공통점과 차이점이 있습니다. 공통점클라이언트 측 저장소:둘 다 브라우저에 데이터를 저장하며 서버에 요청을 보내지 않고 클라이언트 측에서 데이터를 저장할 수 있습니다.키-값 쌍 저장:둘 다 키-값 쌍의 형태로 데이터를 저장합니다. 데이터는 문자열 형식으로 저장되며, 객체를 저장할 때는 JSON으로 변환하여 저장해야 합니다.동일한 API:둘 다 동일한 API 메서드를 사용합니다 (setItem, getItem, removeItem, clear). 차이점유효 기간:localStorage: 데이터는 명시적으로 삭제되지 않는 한 영구적으로 ..