본문 바로가기

CS/Web

(7)
앱 개발 방식 네이티브 앱, 하이브리드 앱, 웹 앱, PWA 각각의 개발 방식과 장단점을 이해 네이티브 앱 & 웹 앱 & 하이브리드 앱 | 👨🏻‍💻 Tech Interview 네이티브 앱 & 웹 앱 & 하이브리드 앱 네이티브 앱 (Native App) 흔히 우리가 자주 사용하는 어플리케이션을 의미한다. 모바일 기기에 최적화된 언어로 개발된 앱으로 안드로이드 SDK를 이용한 Java 언 gyoogle.dev 네이티브 앱(Native App) 모바일 기기에 최적화된 언어로 개발된 앱으로 안드로이드나 iOS 기반의 SDK를 이용한 앱 웹 앱과 하이브리드 앱에 비해 성능이 가장 높고 네이티브 API를 호출하여 사용함으로 플랫폼과 밀착되어 있다는 장점 하지만 버전 및 기기별로 지원되는 기능에 차이가 있는 것처럼 플랫폼에 한정적..
SSR & CSR UI/UX와 렌더링의 기본 개념과 렌더링 동작 과정에 대해 이해 UI/UX UI? User Interface로, 사용자에게 보여지는 view, 디자인, 레이아웃을 의미 폰트, 색깔, 줄간격 등의 디자인 요소가 포함됨 UX? User eXperience로, 사용자들의 경험을 분석하여 더 편하고 효율적인 방향으로 프로세스가 동작할 수 있도록 만드는 것을 의미 터치화면, 사용자의 선택 flow 등 로그인 기능을 구현할 때 요구되는 UX의 예시? id나 email 작성 시 영문 타자키가 보여지는 것 id작성 후 엔터키를 누르면 비밀번호 입력태그로 넘어가는 것 정해진 형식에 어긋나면 실시간으로 형식에 어긋난 입력임을 나타내 주는 것 로그인 인증 실패 시 이메일(ID)이 틀렸는지, 비밀번호가 틀렸는지 구분해서 알려..
인증 & 인가, 로깅 인증(Authentication) : 제대로 된 사용자인지 확인하는 과정 인가(Authorization) : 해당 요청에 대해 허가된 접근인지 확인하는 과정 인증 방식 | 👨🏻‍💻 Tech Interview 인증 방식 API Key 서비스들이 거대해짐에 따라 기능들을 분리하기 시작하였는데 이를위해 Module이나 Application들간의 공유와 독립성을 보장하기 위한 기능들이 등장하기 시작했다. 그 중 제일 먼 gyoogle.dev 인증 방식 API Key OAuth2.0 JWT(토큰 기반 인증) 정보가 서버에 저장되지 않기 때문에 서버 메모리 부담이나 멀티 디바이스 환경에 대한 부담이 없음 상대적으로 손상의 위험이 있고, XSS 공격에 취약해 가능한 민감 정보는 포함시키지 않을 필요가 있음 세션 기반..
Web Server & WAS Web Server : 정적인 페이지(바뀌지 않는 페이지)를 반환함 WAS : 동적인 페이지(인자에 따라 바뀌는 페이지)를 반환함 Web Server와 WAS의 차이 | 👨🏻‍💻 Tech Interview Web Server와 WAS의 차이 웹 서버와 was의 차이점은 무엇일까? 서버 개발에 있어서 기초적인 개념이다. 먼저, 정적 페이지와 동적 페이지를 알아보자 Static Pages 바뀌지 않는 페이지 웹 서버는 파일 경 gyoogle.dev Web Server란 무엇인가? Http 프로토콜을 기반으로, 클라이언트의 요청을 서비스하는 역할 정적 컨텐츠 제공 : WAS를 거치지 않고 바로 자원 응답 동적 컨텐츠 제공을 위한 요청 전달 : WAS로 요청 전달 후 WAS에서 처리한 결과를 응답 WAS란 무엇..
REST API REST : REpresentational State Transfer, 웹(HTTP)의 장점을 활용한 아키텍쳐 REST의 개념과 구성, RESTful하게 API를 설계하는 방법과 그 장점을 이해한다. REST API | 👨🏻‍💻 Tech Interview REST API REST : 웹 (HTTP) 의 장점을 활용한 아키텍쳐 1. REST (REpresentational State Transfer) 기본 REST의 요소 Method Method 의미 Idempotent POST Create No GET Select Yes PUT Update Yes DELETE Delete Yes Idempotent : 한 번 수행하냐 gyoogle.dev REST 메소드 4가지 설명 GET : select, 정보를 조회..
쿠키&세션, Http Status code 1. 쿠키, 세션, 브라우저 캐시의 차이와 역할 이해 2. Http 상태 코드마다 무슨 의미를 갖는지 이해 Cookie & Session | 👨🏻‍💻 Tech Interview 최종 수정 : 12/24/2020, 11:41:27 AM gyoogle.dev HTTP status code | 👨🏻‍💻 Tech Interview HTTP status code 클라우드 환경에서 HTTP API를 통해 통신하는 것이 대부분임 이때, 응답 상태 코드를 통해 성공/실패 여부를 확인할 수 있으므로 API 문서를 작성할 때 꼭 알아야 할 것이 HTTP status code gyoogle.dev 쿠키와 세션을 사용하는 이유? 둘의 차이는? 클라이언트의 정보를 저장하기 위해 사용 쿠키는 클라이언트 단에 저장되며, 도메인 당..
브라우저 동작 브라우저 주소창에 url이 입력되었을 때 어떤 과정을 거쳐서 화면이 출력되는지 과정 이해 브라우저 동작 방법 | 👨🏻‍💻 Tech Interview 브라우저 동작 방법 "브라우저가 어떻게 동작하는지 아세요?" 웹 서핑하다보면 우리는 여러 url을 통해 사이트를 돌아다닌다. 이 url이 입력되었을 때 어떤 과정을 거쳐서 출력되는걸까? web의 기 gyoogle.dev 브라우저 동작 과정 주소창에 url을 입력하면, DNS로 IP주소를 찾아 내 해당 서버로 자원을 요청 기본적인 html파일과 css, image 파일 등을 응답받게 되면 렌더링 엔진이 html파싱을 수행하며 dom트리를 구성하고, 이어서 css 파싱을 통해 렌더링 트리를 만듦 마지막으로 UI 백엔드에서 해당 정보를 가지고 화면에 ui를 그림 ..