profile
웹 개발자

웹에서의 이미지 파일 포맷

특별한 플러그인 없이 바로 쓸 수 있는 간단함때문에 수십년동안 웹에서 가장 널리 사용되었던 포맷. 간단한 애니매이션이 가능하기 때문에 지금은 짤을 만들 때 주로 사용하는 것 같다.최대 256개의 색을 가지는 팔레트를 만들어 두고, 각 픽셀에는 팔레트의 인덱스를 나타내는

2021년 1월 31일
·
0개의 댓글

REST

REST = Representational State Transfer2000년에 로이 필딩이 박사논문에서 소개한 개념으로, 네트워크의 리소스가 어떻게 정의되고, 어떻게 주소를 표현하는 지를 나타내는 몇가지 원칙에 기반한 소프트웨어 아키텍쳐이다. 웹에 있는 자원들을 구조

2021년 1월 19일
·
0개의 댓글

CORS

동일 출처 정책은 악의적인 사이트에서 다른 사이트의 리소스에 접근하는 것을 막아주지만, 정상적인 접근까지 모두 차단해버린다. 모던 웹 어플리케이션에서는 다른 출처에 공개돼 있는 데이터를 활용하는 경우가 굉장히 많은데, SOP는 이런 경우에도 모든 요청을 차단한다.개발자

2021년 1월 18일
·
2개의 댓글
post-thumbnail

SOP

🤨 동일 출처 정책 동일 출처 정책(Same-origin policy)이란 한 문서에서 다른 출처의 리소스와 상호작용하는 것을 제한하는 정책이다.

2021년 1월 17일
·
0개의 댓글
post-thumbnail

Udemy의 Understanding TypeScript - 2021 Edition 강의 후기

강의가 타입스크립트가 처음인 사람들이 잘 이해할 수 있도록 구성되어있다. 타입스크립트의 기초적인 개념부터 세부적인 기능까지 전반적으로 훑어보는 식으로 강의를 진행하며, 실제 프로젝트에서는 어떻게 적용하는지, React, Node.js와는 어떻게 같이 활용하는 지 등을

2020년 12월 31일
·
0개의 댓글
post-thumbnail

구글 웹마스터 컨퍼런스 내용 정리

01. 구글 검색의 작동 원리 색인되있는 정보를 사용자에게 제공 색인단계 크롤링 이전 크롤링결과+사이트맵에서 시작 링크로 이동 서치콘솔 사이트 소유자가 크롤링 방법 설정 재크롤링 요청 혹은 크롤링에서 제외 발견된 웹페이지들은 구글 서버로 색인 생성 - 키

2020년 12월 28일
·
0개의 댓글

React 성능 최적화

리액트에서 불필요한 렌더링을 최소화하여 성능을 최적화할 수 있습니다. 성능 최적화를 시도해보면서 공부해보겠습니다.

2020년 12월 27일
·
0개의 댓글

HMAC 구현해보기 (feat. 함수형 프로그래밍)

HMAC을 직접 구현해보고 적용하였다..! 처음에 생성 과정을 봤을 때는 이게 뭔가 싶었는데 지금은 이해를 다 하고 있으니까 생각보다 쉽게 코드로 구현할 수 있었다. 그래서 마스터 세션에서 본 함수형 프로그래밍도 나름대로 적용해보고 재미있었던 경험이었다.hmac.js

2020년 12월 17일
·
0개의 댓글
post-thumbnail

CSRF

csrf란? > Cross-site request forgery, 사이트 간 요청 위조 사이트 간 요청 위조는 웹사이트 취약점 공격의 하나로, 사용자가 자신의 의지와는 무관하게 공격자가 의도한 행위를 특정 웹사이트에 요청하게 하는 공격을 말한다. csrf의 예시

2020년 12월 11일
·
0개의 댓글

button hover

pbsc.com의 버튼 인터랙션을 만들어보았다.:before로 회색 배경을 만들고 :after로 아래에서 올라오는 텍스트를 구현했다.그리고 attr() 로 css에 HTML태그의 속성을 적용할 수 있는 걸 예전에 본 것 같은데, 이번에 클론하면서 사용해볼 수 있었다.!

2020년 8월 27일
·
0개의 댓글

Chat Bar Interaction

https://dribbble.com/shots/6155986-Chat-Bar-Interaction?utmsource=ClipboardShot&utmcampaign=Volorf&utmcontent=Chat%20Bar%20Interaction&utmmedium=Socia

2020년 8월 26일
·
0개의 댓글

Text hover effect

자바스크립트 컨퍼런스 사이트의 인터랙션을 따라해보았다.마우스를 올리면 여러 색의 랜덤 글자로 빠르게 전환되는 효과!codesandboxexciting-rosalind-d8q42?fontsize=14&hidenavigation=1&theme=dark

2020년 8월 24일
·
0개의 댓글

slider

뭔가 허전한 느낌인데 라인에도 인터랙션이 있으면 좋을 것 같다.!codesandboxgreat-clarke-e4kch?fontsize=14&hidenavigation=1&theme=dark

2020년 8월 22일
·
0개의 댓글
post-thumbnail

Udemy의 React with Next.js 강의 후기

일단 강의 구성은 여러가지 앱을 만들어보면서 React와 Next의 개념에 익숙해지게 되어있다.포트폴리오 앱, 뉴스 사이트 클론, Express 연결, SNS와 같은 서비스들을 만들고 배포하게 되며 9.5시간의 강의동안 많은 결과물들을 만들 수 있다.빠르게 결과물을 만

2020년 8월 22일
·
0개의 댓글

Generator - 2

제너레이터, iterator, iterable을 이용하면 함수형 프로그래밍의 대표적인 함수를 쉽게 구현할 수 있다.result에는 제너레이터 객체가 저장된다\[...result]가 실행될 때 계산이 실행된다(필요할 때만 연산하기 때문에)이렇게 필요한 순간에만 연산하는

2020년 5월 18일
·
0개의 댓글
post-thumbnail

Generator - 1

제너레이터는 ES6에서 등장한 개념으로 함수의 실행을 중간에 멈추고 재개할 수 있는 독특한 기능이다. 실행을 멈출 때 값을 전달할 수 있기 때문에 반복문에서 제너레이터가 전달하는 값을 하나씩 꺼내서 사용할 수 있다.제너레이터는 별표와 함께 정의된 함수가 반환하는 객체이

2020년 5월 5일
·
0개의 댓글

Promise - 2

프로미스 활용하기

2020년 4월 26일
·
0개의 댓글
post-thumbnail

Promise - 1

프로미스의 개념과 이해

2020년 4월 23일
·
0개의 댓글
post-thumbnail

async await

async await는 비동기 프로그래밍을 동기 프로그래밍처럼 작성할 수 있도록 함수에 추가된 기능이다. ES2017에서 자바스크립트 표준이 되었으며, async await를 이용해서 코드를 작성하면 가독성이 좋아진다.

2020년 4월 18일
·
0개의 댓글

primitive type(원시 타입), Objects(객체)

리액트 튜토리얼을 하다가 componentDidMount 에서 prevState와 this.state의 값이 같은 문제가 발생했다. 찾아보니 메소드에서 의도치 않게 state의 값을 변경해서 그런 것이었다. 지금까지 let contactData = this.stat

2020년 3월 30일
·
0개의 댓글