웹 개발 관련 링크
2021년 10월 2일 수정
≡ 목차 (Table of Contents)
Frameworks
- 🌏Vue and Svelte — A Lot Alike, But Some Important Differences
- 🌏프론트엔드 개발환경의 이해: 웹팩(기본): 웹팩(webpack) 기본에 대한 방대한 내용
- 🌏halfmoon: 보기 드문 다크모드 전용 프레임워크. 부트스트랩을 닮았다.
Interfaces
- 🌏Headroom.js: 자동으로 사라지는 헤더 인터페이스 구현 라이브러리
Animations
- 🌏Sal.js: 가볍고 의존성 없는 스크롤 애니메이션 라이브러리
Javascript
Specifications
- 🌏개발자가 필히 알아야 할 ES6 10가지 기능
- 🌏자바스크립트의 메모리 모델
- 🌏ES2019 무엇이 달라졌나요?
- 🌏모던 JavaScript 튜토리얼: 그냥 하나의 제대로 된 책과 다름 없는 자바스크립트 설명서다. 내용은 방대하지만 한글이니 이해하기는 편할 것 같다.
Special Tips
- 🌏 Sign With Apple 예제: 자바스크립트로 애플 인증을 구현하는 방법.
CSS
Specifications
Generators and Tools
- 🌏CSS Shadows Generator
- 🌏Fancy Border Radius
- 🌏CSS Easing Gradients
- 🌏Accessible Color Generator
- 🌏CSS Separator Generator
- 🌏Purgecss: 쓰지 않는 CSS를 삭제하는데 도움을 주는 도구
- 🌏Make a smooth shadow, friend: 여러 레이어를 활용한 부드러운 그림자 CSS 코드를 만들어주는 도구 웹페이지
- 🌏filters.css: CSS only library to apply color filters.
- 🌏Frontend Toolkit: 개발자를 위한 여러가지 도구 모음 - Package size, SVG to TSX/JSX, SVG Optimizer, SVG to CSS, Colors Converter, Format JS/TS, Format CSS, Image Optimizer, Format JSON, CSS & SVG Symbols
- 🌏Tiny Helpers: 많은 수의 작은 도구들 모음
- 🌏DevUtils.app: 여러가지 개발에 도움을 주는 기능을 제공하는 macOS 전용 앱
Others
- 🌏500+ CSS Icons: 순수 CSS로 작성된 500개 이상의 아이콘 벡터 이미지들
Web App
- 🌏Ultralight: lightweight, cross-platform HTML rendering engine based on WebKit.
Imaging
- 🌏smartcrop.js: Smartcrop.js implements an algorithm to find good crops for images. It can be used in the browser, in node or via a CLI. 이미지의 중요 내용을 파악해서 크롭하는 도구.
- 🌏Content-Aware Image Resizing in Javascript: 이미지를 조작해서 이미지를 자연스럽게 리사이즈하는 방법.
Server Infras
Others
- 🌏htmlq: Like jq, but for HTML.
- 🌏RunJS: The JavaScript playground for your desktop
- 🌏FE개발자의 성장 스토리 09 : Offscreencanvas 적용기: OffscreenCanvas Web API 기술, 즉 canvas를 처리하는 로직을 화면 밖(off screen)에서 처리할 수 있도록 하는 API. 이 API를 이용하면, DOM 엘리먼트인 canvas를 떼어내서(detach) Web Worker에서 처리함으로써 Main thread에서 동작하던 캔버스 코드를 Worker thread에서 실행해서 성능을 향상시킬 수 있다.
- 🌏당신이 모르는 자바스크립트의 메모리 누수의 비밀: 크롬 개발자도구로 하는 디버깅과 해결책을 찾아서!
- 🌏아이폰X 안전영역(Safe Area) 대응 사례 공유: 아이폰의 안전 영역을 웹 페이지에서 다루기.
- 🌏APP 내에 감쪽같이 WEB VIEW 속이기 대작전: 웹뷰로 구현된 화면을 마치 네이티브로 구현한 것처럼 위화감이 없도록 만드는 몇 가지 노하우를 설명한다.
- 🌏Duktape - embeddable Javascript engine with a focus on portability and compact footprint: C로 구현된 임베디드 자바스크립트 엔진? 의존성도 좋고 C 혹은 호환되는 언어들과 궁합이 좋은 듯. ES5, ES5.1, ES6(일부), ES7(일부) 지원.
- 🌏HTTPie: Curl을 대체할 수 있는 현대적인 HTTP Request/Response 유틸리티.
- 🌏Node.js 기반에서 환경변수 사용하기 (dotenv, cross-env): 환경 변수(Environment Variable), Node.js에서 사용하는 방법 정리.
- 🌏🚿 타입스크립트를 위한 클린코드 - 한글 번역판 🇰🇷
- 🌏Color Hexa: 다양한 색상 정보
- 🌏Leonardo: 채도 기반 색상 생성기
- 🌏이메일 보안 강화 기능 소개 - 도메인 보호, DKIM, DMARC
- 🌏[Webpack] 웹팩 개념 알아보기
- 🌏[JavaScript 오디오 이펙터 만들기] 오디오 이펙터로 나만의 소리 만들기