FrontEnd
쿠키
이번에 생활코딩님의 쿠키강의를 보고 공부를 해보았다! https://opentutorials.org/course/3387/21740 쿠키의 생성 - 생활코딩 수업소개 Node.js를 이용해서 쿠키를 생성하는 방법을 알려드립니다. 강의 소스코드 nodejs/cookie.js var http = require('http'); http.createServer(function(request, response){ // response.writeHead(200, { // 'Set-Cookie':['yummy opentutorials.org 우선 쿠키에 대해 조금 알아보자. 쿠키는 인증,개인화,방문자 체크 등의 용도로 사용될 수 있다. https://developer.mozilla.org/ko/docs/Web/HTT..
HTTP란?
HTTP란 HyperText Transfer Protocol의 약자이다. 결국 웹은 클라이언트와 서버와의 관계이다. 클라이언트가 HTML을 Request 하면 서버는 Response를 줄 것이다. 이러한 과정에서는 서로 소통할 수 있게 약속된 메시지의 룰이 필요하다. 이 역할을 해주는 것이 HTTP이다. 만약 어떤 웹페이지를 개발자도구의 네트워크 탭에 들어가보면 위와같이 수많은 파일들을 주고받는것을 알 수 있다. html 파일의 header를 보면 위와같이 request의 정보나, 수신 상태 등을 알 수 있다. 웹브라우저는 이러한 응답 헤더를 만들어서 서버에 보내고, 받은 정보를 토대로 웹브라우저에 그려주는 역할을 한다. 그럼 이제 request와 response에 대해서 조금 더 알아보자. reques..
scss keyframe 적용법
일반적인 방법으로는 scss에 @keyframe을 적용할 수 없었다. @mixin keyframes($animation-name) { @-webkit-keyframes #{$animation-name} { @content; } @keyframes #{$animation-name} { @content; } } @mixin animation($str) { -webkit-animation: #{$str}; animation: #{$str}; } @include keyframes(fade) { 0% { opacity: 1; } 100% { opacity: 0; } } 위와같이 mixin과 include를 활용해서 넣어주어야 한다. 위 예시는 fade를 적용시켜본 경우이다. 그 이후, class-name { @i..
16_CSS 네이밍 규칙
항상 지금까지 css 이름을 지을땐 나름의 규칙만 가지고 지었었는데, 이번 기회에 이를 바로잡을 필요가 있다고 생각하여 css 에서 class 이름을 짓는다면 어떤 방식으로 지어야 하는지 알아보았다. 보통 자바스크립트에서는 Camel case로 불리는 규칙을 많이 사용한다. myNameIsMingyu 와 같은 형태이다. 하지만 css에서는 그렇지 않다. CSS에서는 우선 기본적으로 소문자와, 하이폰( - ) 을 사용한다 my-name-is-mingyu 와 같은 방식이다. BEM 규칙 BEM규칙이란 Block, Element, Modifer의 줄인말이다. 아래 형태의 html을 보면서 생각해 보자. Search Block은 기능적으로 독립된 컴포넌트이다. search-form 이 이에 해당된다. Eleme..
Unix와 Windows 파일 시스템
🐘 Unix 파일시스템 💡 파일 시스템 : 파일을 저장하는데 사용되는 수단으로 디스크에 파일을 저장한다.** 시스템 내의 수많은 파일이 존재하는데, 이를 효율적으로 관리하기 위해서는 트리형으로 파일을 관리할 필요성이 있다. 특히 유닉스의 파일은 파일이름 , i-node , 데이터 블록 세가지 요소를 모드 충족해야 한다. 🐬 파일 이름 규칙 ✅ 특별한 확장명 없이 이름 사용 ✅ .으로 시작하는 파일의 경우 숨어있는 파일을 의미 주로 시스템 파일에 사용 ls 명령어에 옵션 -a를 설정해야 파일의 존재 확인 ✅ 파일 이름은 최대 255자까지 허용 ✅ 루트를 의미하는 /는 사용 불가 ✅파일과 디렉토리 이름에는 알파벳, 숫자, -, _, . 만을 사용 ✅ 파일과 디렉토리 이름에 공백, * & " ' ~ # $ (..
정규표현식
정규표현식을 잘 사용하면 정말 유용하게 문자열들을 걸러낼 수 있다 🐘 JS에서의 간단한 사용 예 const text = "실행할 텍스트"; console.log(text.match(정규표현식)); 🐘 정규표현식의 기초 문법 "시간을 달리는 부캠 week-2 입니다. 연락은 010-1234-5678 9시간 이내" 이라는 텍스트를 가지고 실험해보자. 🐘 문자만 들어온 경우 /시/ : ‘시’를 하나 만 찾는다. "시간을 달리는 부캠 week-2 입니다. 연락은 010-1234-5678 9시간 이내" [ ‘시’ ] 옵션 🐘 g /시/g : ‘시’를 모두 찾는다. "시간을 달리는 부캠 week-2 입니다. 연락은 010-1234-5678 9시간 이내" [ '시', '시' ] /시간/g : ‘시간’를 모두 찾는다...