You Can Become A
늦게 시작해도 누구든지 노력하면 개발자가 될수 있어요 !
👩💻 AS-IS / TO-BE 란 무슨 뜻 일까?
AS-IS / TO-BE 기법 As-Is / To-Be 기법은 현재(as is)와 이상(to be) 사이의 차이(gap)을 찾아내어 목적을 개선하여 달성하는 비즈니스 기법이다. 간단히 쉽게 용어의 핵심만 정리하면 아래와 같다. AS-IS 분석 : 현재의 상태나 모습 (개선 되기 이전 상태) TO-BE 분석 : 미래의 이상적인 상태나 목표 (개선된 후의 상태) GAP 분석 : as-is 와 to-be 사이의 차이를 분석해서 방향 제시 (개선을 하기위해 어떤 노력을 해야하는지) 즉, AS-IS, TO-BE 분석이란 현상의 문제를 확인하고 해결하기 위해 현재의 상황(AS-IS)를 인식하고 현재의 상황과 이상적인 지향점(TO-BE)과의 차이(Gap)을 인식하고, 이를 일치시키기 위한 전략적 사고 방식이라고 할 ..
🌐 Polling / Long Polling / Server Sent Event / WebSocket 정리
서버의 event를 클라이언트로 보내는 4가지 방법 polling 클라이언트가 평범한 http request를 서버로 계속 날려서 이벤트 내용을 전달받는 방식이다. 가장 쉬운방법이지만 클라이언트가 계속적으로 request를 날리기때문에 클라이언가 많아지면 서버의 부담이 급증하게 된다. http request connection을 맺고 끊는것 자체가 부담이 많은 방식이다. 그리고 클라이언트에서 실시간정도의 빠른 응답을 기대하기도 어렵다. polling은 http 오버헤드가 발생한다는 단점이 있다. 하지만 일정하게 갱신되는 서버 데이터의 경우 유용하게 사용할 수 있는 방식이다. (ex. 대시보드 갱신) Http Overhead 란? 정보의 신뢰성 판단을 위한, 보내지는 헤더 같은 정보 때문에 오히려 데이터량..
🌐 HTTP Overhead 란?
오버헤드 란? 오버헤드(overhead)가 됬다라는 말은, 처리 시간 및 메모리등이 추가적으로 사용되는 현상을 말한다. 예를들어, A라는 처리를 실행한다면 3초 걸린다고 했는데, 안전성을 고려하여 추가로 B라는 처리를 가미한 결과 처리시간이 10초가 걸렸다고 하자. 그러면, 이 때 오버헤드는 7초 이게 된다. 반대로 7초가 걸리는 B를 개선해 A+B 처리를 한 결과 처리시간이 총 5초가 되었다면, 오버헤드가 5초 단축되었다고 말할 수 있다. HTTP(Protocol) 오버헤드 HTTP(프로토콜) 오버헤드란, 네트워크를 통해 대상으로 라우팅되는 데이터와 함께 전송되어야하는 정보를 말하며, 올바른 대상에 도달하기 위해 전송중인 데이터에 추가로 보내지는 정보라 보면 된다. 이게 당최 무슨말이냐 하면, 원래 정..
🌐HTTP referer 란?
HTTP Referer referer는 http 헤더중 하나이다. HTTP 프로토콜에는 referer 라는 헤더값이 있는데, 브라우저가 서버로 이 헤더값을 설정해서 보내게 된다. 그리고 서버는 referer를 참조함으로써 현재 표시 하는 웹페이지가 어떤 웹페이지에서 요청되었는지 알수 있으며, 어떤 웹사이트나 웹서버에서 방문자가 왔는지를 파악할수 있는 기능을 referer 를 통해 할수 있다. 예를들어, http://www.test.com/1.html 이라는 웹페이지에 있는 링크를 클릭하여 http://www.power.com/2.html 으로 이동했을 때 referer는 http://www.test.com/1.html 이 된다. 간단하게 말하자면, 헤더에 담겨 있는 현재 페이지에 요청한 이전 페이지의 u..
📈 구글 애널리틱스 API 신청해서 ✔️ 내 티스토리 트래픽 정보 가져오기 💯 정리
Google Analytics 란? 구글 애널리틱스(Google Analytics, GA)는 구글에서 무료로 제공하고 있는 웹분석 서비스다. 구글의 고유한 통계 및 머신러닝 기술로 사이트 및 모바일 애플리케이션 방문자들의 행동 데이터를 분석하고, 마케팅의 실적이나 웹사이트의 경험을 개선할 수 있도록 도와주는 도구이다. 구글 애널리틱스에 단지 사이트만 등록하면, 그 사이트에 대한 모든 트래픽 실시간 정보들을 손쉽게 api를 통해 얻을 수 있으니, 개발자는 따로 OAuth나 api설정없이 데이터를 얻을수 있어서 매우 편리한 툴임에는 틀림없다. Google Analytics 만들기 1. 관리(톱니바퀴 아이콘) -> 계정만들기 버튼 클릭 2. 계정 이름 입력 3. 속성 이름 입력 / 보고시간대 (대한민국) / ..
🌐 Access Token & Refresh Token 원리
Access Token & Refresh Token 이번 포스팅에서는 기본 JWT 방식의 인증(보안) 강화 방식인 Access Token & Refresh Token 인증 방식에 대해 알아보겠다. 먼저 JWT(Json Web Token) 에 대해 잘 모르는 독자들은 다음 포스팅을 참고하길 바란다. [WEB] 📚 JWT(Json Web Token )란? 💯 정리 Cookie & Session [WEB] 🌐 세션/ 쿠키 🍪 정리 비연결성(Connectionless)과 비상태성(Stateless) HTTP 프로토콜에는 비연결성(Connectionless)과 비상태성(Stateless)이라는 특징이 있습니다. 이는 서버의 자원.. inpa.tistory.com Refresh token이 왜 필요한가 Access..
🌐 JWT 토큰 인증 이란? (쿠키 vs 세션 vs 토큰)
Cookie / Session / Token 인증 방식 종류 보통 서버가 클라이언트 인증을 확인하는 방식은 대표적으로 쿠키, 세션, 토큰 3가지 방식이 있다. JWT를 배우기 앞서 우선 쿠키와 세션의 통신 방식을 복습해보고 이들의 각각 특징과 장단점 그리고 왜 토큰 인증 방식을 사용하지는에 대해 간단하게 알아보자. (주입식 암기하지말고 과정을 이해하면 머릿속에 더 오래 남을 것이다!) Cookie 인증 쿠키는 Key-Value 형식의 문자열 덩어리이다. 클라이언트가 어떠한 웹사이트를 방문할 경우, 그 사이트가 사용하고 있는 서버를 통해 클라이언트의 브라우저에 설치되는 작은 기록 정보 파일이다. 각 사용자마다의 브라우저에 정보를 저장하니 고유 정보 식별이 가능한 것이다. Cookie 인증 방식 브라우저(클..
🧏 SEO 사이트 최적화 속도 향상 방법 모음 정리
1. 폰트 로딩 최적화 @import 사용 피하기 @import url(http://fonts.googleapis.com/earlyaccess/nanumgothic.css); @import는 폰트를 불러오는데 브라우저 로딩을 잠시 멈춰 세운다. 폰트를 로딩하고 나서야 그다음 css을 로딩하기 때문이다. @font-face 사용 따라서, link혹은 @font-face를 통한 웹폰트 로딩을 사용하도록 하자. link태그의 href링크로 가보면 안에 @font-face로 코딩되어있는 페이지를 볼수있다. 즉 그게 그거이다. /* 웹폰트 로드 */ @font-face { font-family: 'GmarketSansMedium'; src: url('https://cdn.jsdelivr.net/gh/project..
🌐 OAuth 2.0 개념 - 그림으로 이해하기 쉽게 설명
OAuth란? 웹 서핑을 하다 보면 Google과 Facebook 등의 외부 소셜 계정을 기반으로 간편히 회원가입 및 로그인할 수 있는 웹 어플리케이션을 쉽게 찾아볼 수 있다. 클릭 한 번으로 간편하게 로그인할 수 있을 뿐만 아니라, 연동되는 외부 웹 어플리케이션에서 Facebook 및 Twitter 등이 제공하는 기능을 간편하게 사용할 수 있다는 장점이 있다. 예를 들어, Google로 로그인하면 API를 통해 연동된 계정의 Google Calendar 정보를 가져와 사용자에게 보여줄 수 있다. 이 때 사용되는 프로토콜이 바로 OAuth다. OAuth에 대한 정의는 다음과 같다. OAuth는 인터넷 사용자들이 비밀번호를 제공하지 않고 다른 웹사이트 상의 자신들의 정보에 대해 웹사이트나 애플리케이션의 접..
🌐 웹 표준 & 웹 접근성 이란?
웹 표준 (Web Standards) 웹 표준은 웹에서 사용되는 기술들의 표준화를 의미한다. 즉, 웹 사이트를 구성하는 HTML, CSS, JavaScript 등의 언어들이 표준화된 방식으로 작성되어야 한다는 것이다. 쉽게 말하면 사용자가 어떤 브라우저나 기기를 사용하더라도 홈페이지 화면을 동일하게 볼 수 있도록 하는 것이 웹 표준인 것이다. 웹 표준의 장점 웹 페이지를 작성할 때 웹 표준을 준수하면 다음과 같은 효과를 누릴 수 있게 된다. 1. 웹 페이지의 호환성 웹 표준을 준수하면, 웹 페이지가 모든 브라우저에서 일관적으로 표시되게 된다. 이를 통해 사용자들은 어떤 브라우저를 사용하더라도 동일한 사용자 경험을 얻을 수 있어 오래된 브라우저에서도 컨텐츠가 적절하게 표시되고 호환성과 운용성이 확보된다. ..
👩💻 CI / CD / 파이프라인 이란?
CI/CD CI (Continuous Integration) CI/CD의 "CI"는 개발자를 위한 자동화 프로세스인 지속적인 통합(Continuous Integration)을 의미한다. CI를 성공적으로 구현할 경우 애플리케이션에 대한 새로운 코드 변경 사항이 정기적으로 빌드 및 테스트되어 공유 리포지토리에 통합되므로, 여러 명의 개발자가 동시에 애플리케이션 개발과 관련된 코드 작업을 할 경우 서로 충돌할 수 있는 문제를 해결할 수 있다. CD (Continuous Delivery / Deployment) CI/CD의 "CD"는 지속적인 서비스 제공(Continuous Delivery) 및/또는 지속적인 배포(Continuous Deployment)를 의미하며 이 두 용어는 상호 교환적으로 사용된다. 두..
🗼 TCP / IP 4계층 모델 - 핵심 총정리
TCP / IP 개념 정리 (선수 지식) IP (인터넷 프로토콜) 지정한 IP 주소에 데이터의 조각들을 패킷(Packet)이라는 통신 단위로 최대한 빨리 목적지로 보내는 역할. 조각들의 순서가 뒤바뀌거나 일부가 누락되더라도 크게 상관하지 않고 보내는 데 집중을 한다. 그래서 IP 프로토콜은 패킷의 순서 보장도 할 수 없고 패킷이 중간에 유실되도 이에대한 방안이 없다. TCP (전송 제어 프로토콜) 패킷 데이터의 전달을 보증하고 보낸 순서대로 받게 해준다 도착한 조각을 점검하여 줄을 세우고 망가졌거나 빠진 조각을 다시 요청하는 식으로 순서를 보증. TCP는 데이터를 상대방에게 확실하게 보내기 위해서 3 way 핸드쉐이킹이라는 방법을 사용하고 있다. 이 방법은 패킷을 보내고 잘 보내졌는지 여부를 상대에게 확..
