Psychogrammer

🌕 Front/📑 Web Theory 검색 결과

해당 글 10건

HTTP / HTTPS 동작 원리를 살펴보자

1. 어떤 보안 위험이 있다는 거지? 첫 째: 개인정보가 담긴 정보를 서버로 보낼 때, 어떤 놈이 갈취해갈 수 있음 둘 째: 피싱 사이트에 접속해 개인 정보를 갈취해갈 수 있음 HTTPS는 사이트에 보내는 정보를 제 3자가 보지 못하게 하며, 접속한 사이트가 믿을 만한 사이트인지 알려준다. 2. HTTPS를 이해하려면 1) 대칭키 방식: 암호화에 쓰이는 키와 복호화에 쓰이는 키가 동일한 기법 클라이언트와 서버가 대칭키 방식으로 통신을 한다면 클라이언트, 서버 모두 키를 가지고 있어야한다. 하지만 애초에 클라이언트에게 키를 전달하는 것 자체도 위험하며, 또한 클라이언트의 스코드는 누구든지 열어볼 수 있으므로 가지고 있기도 굉장히 위험하다. 즉, 원거리에서 대칭키를 안전하게 전달하는 것이 매우 어렵다. 2)..

🌕 Front/📑 Web Theory 2022. 3. 31. 22:40

[DNS] 동작 원리를 꼼꼼하게 살펴보자!

1. Domain 네트워크 통신에는 고유의 주소(IP 주소)가 필요하다. 이때 IP는 사람이 이해하고 기억하기 어렵기 때문에, 각 ip에 이름을 부여했고 이를 도메인이라고 한다. 예를 들어 142.250.207.14의 도메인은 google.com이다. 2. DNS (Domain Name System) DNS는 도메인을 입력하면 IP 주소를 변환해준다. 정확히는, 인터넷 도메인 주소 체계로 TCP/IP의 응용 계층에서, www.example.com과 같은 주 컴퓨터의 도메인 이름을 192.168.1.0과 같은 IP 주소로 변환하고, 라우팅 정보를 제공하는 분산형 데이터베이스 시스템이다. 쉽게 말해, 도메인에 연결된 서버의 주소를 찾아주는 역할을 하며 도메인 서버, 네임 서버라고도 불린다. 3. DNS 서버..

🌕 Front/📑 Web Theory 2022. 3. 31. 21:12

[Markdown] 마크다운 내용 정리

Markdown Tutorial Markdown can be easily shared between computers, mobile phones, and people. It’s quickly becoming the writing standard for academics, scientists, writers, and many more. Websites like GitHub and reddit use Markdown to style their comments. 줄바꿈, 문단 구분 줄바꿈 , 라인의 마지막에 공백 두 칸 Enter 하나를 입력하면 줄바꿈이 되지 않는다. 문단 구분 : Enter 두 번 입력 h1 태그인 #에서도 자동으로 구분선이 생긴다. 구분선: ___, ---, 글꼴 서식 *이탤릭체*, _이..

🌕 Front/📑 Web Theory 2021. 12. 22. 16:21

[Emmet] 마크업 언어를 좀 더 빠르게 쓰자

Emmet 이란? HTML과 CSS의 작성의 시간을 단축 시켜주는 확장 기능 사용법: keyword 입력 후 tab키 입력 VScode Setting: "emmet.triggerExpansionOnTab": true Emmet 사용하기 1) HTML 문서 ! + tab 2) 자식노드 >를 사용하여, 자식 요소를 생성할 수 있다. div>ul>li + tab 3) 형제노드 +를 사용하여, 한 요소와 같은 단계에 위치한 요소를 생성할 수 있다. div>ul+ol+div + tab 4) 반복하기 *를 곱셈 연산자로 여러개의 요소를 생성할 수 있다. div>li*3 입력 후 Tab키 5) 그룹화 ()를 사용하여 괄호안에 있는 코드를 묶어 그룹화를 시켜, 요소간 레벨을 맞춘다. div>(header>ul>li*2..

🌕 Front/📑 Web Theory 2021. 12. 22. 16:17

[Web APIs] 브라우저 API

API 개발자가 복잡한 기능을 쉽게 개발할 수 있도록 내부 코드에 신경 쓰지 않아도 복잡한 작업을 쉽게 기능을 가져다 쓸 수 있도록 돕는다. 1) Web APIs (or 브라우저 APIs) Web API는 WHATWG에서 표준을 관리하며 브라우저에서 동작하게끔 만들어진 API이다. 브라우저에 내장되어 있으며 브라우저를 이용해 복잡한 작업들을 쉽게 구현할 수 있도록 도와준다. 비디오 플레이를 시키거나 오디오 소리가 나도록 동작하는 것은 실제로는 백그라운드에서 C++언어와 같은 로우한 언어로 구현이 되어 있지만 사용자가 쉽게 자바스크립트로 사용할 수 있도록 처리가 되어있다. 2) 써드파티 API : 써드파티 API는 브라우저에 내장되어있는 API가 아닌, 외부에서 가져다 쓰는 API입니다. 트위터나 유튜브와..

🌕 Front/📑 Web Theory 2021. 11. 17. 12:05

OAuth Dance

인터넷 서비스는 SaaS(Software as a Service)의 형태이다. 서비스 중에서 사용자가 필요한 일부만 사용할 수 있게 한다. Facebook이나 트위터가 세상에 널리 퍼지게된 이유 중에 하나가 외부 서비스에서도 Facebook가 트위터의 일부 기능을 사용할 수 있게 한 것이다. 외부 서비스와 연동되는 Facebook이나 트위터의 기능을 이용하기 위해 사용자가 반드시 Facebook이나 트위터에 로그인해야 하는 것이 아니라, 별도의 인증 절차를 거치면 다른 서비스에서 Facebook과 트위터의 기능을 이용할 수 있게 되는 것이다. 이런 방식은 Facebook이나 트위터 같은 서비스 제공자뿐만 아니라 사용자와 여러 인터넷 서비스 업체 모두에 이익이 되는 생태계를 구축하는데 기여하게 될 것이다...

🌕 Front/📑 Web Theory 2021. 8. 3. 08:38

오픈 그래프(open graph): 링크의 미리보기를 결정하기

페이스북, 네이버 블로그, 카카오톡에서 링크에 대한 미리보기 제목, 설명, 이미지를 표현할 때 사용한다. HTML 문서의 head와 메타정보 메타 데이터들은 HTML 태그에 담겨있습니다. 크롤러도 하나의 소프트웨어 프로그램인지라 HTML 문서를 보면 자동으로 무엇이 제목인지, 무엇이 내용에 대한 3줄 요약인지, 무엇이 대표 이미지인지 100% 자동으로 판별하기 아주 어렵습니다. 따라서 웹사이트가 직접 저렇게 적어서 알려줘야 하는 것입니다. (아무리 머신러닝, 딥러닝, 자연어처리 기술이 발전해도 웹문서와 같이 비정형적인 정보에 대한 100% 정확도의 의미 인식은 불가합니다.) 이런 메타 데이터를 표기하는 방법에 대한 기본 방법(기본 HTML5 title, description 태그 등)을 제외한 제 3의 ..

🌕 Front/📑 Web Theory 2021. 4. 28. 12:01

웹 스크립트 언어: PHP, JSP, ASP

세가지 언어는 모두 웹 스크립트 언어다. 스크립트 파일(a.asp, a.php, a.jsp)을 만들어 올리고 사용자가 해당 페이지를 엑세스 할때, 웹서버에서 즉시 컴파일하여 HTML로 돌려준다. OS: JSP와 PHP는 윈도우, 리눅스, 유닉스에서 돌아가지만 ASP는 Window에서만 운용이 가능하다. DB에 관한 것은 ASP의 경우에도 윈도우 서버에 한정되므로 대부분의 경우 MSSQL을 사용한다. 성능이 좋지만 비싸다. 일반적으로 PHP는 MySQL, JSP는 ORACLE을 사용합니다. 물론 PHP + MSSQL, JSP + MySQL로 구축된 시스템도 있다 PHP와 ASP는 소/중 규모, JSP는 각종 기술을 활용할 대규모 시스템에 알맞다. ASP는 비용이 가장 많이 들어가지만 Window와 IIS,..

🌕 Front/📑 Web Theory 2021. 3. 15. 13:40

JavaScript의 역사

출처: www.youtube.com/watch?v=wcsVjmHrUQg&t=629s 모자이크 웹 브라우저 등장 Netscape: UI 요소를 추가한 정적인 페이지 등장 시장 점유율 80%를 자랑했다. Script언어 추가를 추가한 동적인 페이지 등장 Java는 무겁고 어려워서 스킴 언어로 선택 Netscape Navigator안에 LiveScript를 이해하는 엔진(LiveScript Inrepreter)을 탐재함. 라이브스브립트 언어가 돔 요소를 조작함. 자바의 인기에 올라타서 이름을 자바스크립트라고 지음 자바스크립트 성공에 위기감을 느낀 MS가 역공학을 통해 IE를 만든다. 그대로 배낀 언어를 JScript라고 이름바꿔 시장에 내놓는다. IE와 넷스케이프 브라우저 IE브라우저 간에 호환문제가 생긴다...

🌕 Front/📑 Web Theory 2021. 3. 10. 16:41

정규표현식(Regular Expression)

정규표현식을 해석하는 정규표현식 엔진이 언어 별로 다르게 구현되어 있으니 일부 표현이나 문법이 다를 수 있습니다. 본 포스트에서는 JavaScript를 기준으로 작성합니다. 정규표현식(Regular Expression) : 특정한 규칙을 가진 문자열의 집합을 표현하는데 사용하는 형식 언어이다. 정규식이 필요한 예시 각각 다른 포맷으로 저장된 엄청나게 많은 전화번호 데이터를 추출해야 할 때 사용자가 입력한 이메일, 휴대폰 번호, IP 주소 등이 올바른지 검증하고 싶을 때 코드에서 특정 변수의 이름을 치환하고 싶지만, 해당 변수의 이름을 포함하고 있는 함수는 제외하고 싶을 때 특정 조건과 위치에 따라서 문자열에 포함된 공백이나 특수문자를 제거하고 싶을 때 즉, 문자열의 검색과 치환을 위한 용도로 사용한다. ..

🌕 Front/📑 Web Theory 2021. 2. 14. 20:11