목록Frontend (14)

자니노트

Web Font 모음 및 적용 방법

눈누가 직접 제안하는 용도별 추천 폰트들을 만나 보세요 https://noonnu.cc/ 눈누 상업용 무료한글폰트 사이트 noonnu.cc 네이버 글꼴 https://hangeul.naver.com/font 네이버 글꼴 모음 네이버가 만든 150여종의 글꼴을 한번에 만나보세요 hangeul.naver.com
Frontend/퍼블리싱 2023. 2. 3. 11:22
NPM + Webpack 을 이용한 퍼블리싱 프로젝트 구성

NPM 설치, Webpack 설치, Webpack Dev Server 설치, SASS 설치, 구동.. 등등... https://webpack.js.org/guides/getting-started/ Getting Started | webpack Learn how to bundle a JavaScript application with webpack 5. webpack.js.org https://hmk1022.tistory.com/entry/webpack-%EA%B0%9C%EB%85%90%EA%B3%BC-%EC%A0%81%EC%9A%A9%EB%B0%A9%EB%B2%95 webpack 개념과 적용방법 webpack이란? - 모듈 번들링이라고 한다. - html 파일에 들어가는 JS파일들을 하나의 파일로 만들어주..
Frontend/퍼블리싱 2022. 7. 28. 15:34
유튜브(YouTube) 동영상 Iframe 삽입 방법

https://developers.google.com/youtube/iframe_api_reference iframe 삽입에 대한 YouTube Player API 참조 문서 | YouTube IFrame Player API | Google Developers Embed a YouTube player in your application. developers.google.com https://mslilsunshine.tistory.com/98 youtube player API 적용하는 방법 1. 단순한 iframe 태그로 삽입하는 방법. => 별로 권장되진 않는다. 사용자의 자유도가 좀 떨어짐. 2. youtube API를 이용해 플레이어를 삽입한다. => youtube DEVELOPERS 사이트에서 플레..
Frontend/퍼블리싱 2022. 7. 26. 15:11
[CSS] BEM(Block Element Modifier) 방식

https://nykim.work/15
Frontend/퍼블리싱 2022. 7. 26. 08:49
GitHub + Netlify 를 이용한 웹사이트 배포

https://jsikim1.tistory.com/125 Netlify 를 이용한 누구나 쉽게할 수 있는 웹 사이트 호스팅 사용법! Netlify 를 이용한 누구나 쉽게할 수 있는 웹 사이트 호스팅 사용법! Web Hosting을 할 수 있는 방법, 그리고 웹 호스팅을 할 수 있도록 제공하는 곳은 정말 너무도 많습니다. 그중에서 Netlify 를 jsikim1.tistory.com https://dorudoru.tistory.com/2070 netlify로 나만의 페이지 배포하기 저번에 github로 홈페이지를 만드는 방법을 간단히 설명드렸는데요. 오늘은 netlify로 홈페이지를 만드는 방법을 알아보겠습니다. netlify? 넷리파이라 불리우며 웹사이트를 호스팅해주는 사이트입 dorudoru.tisto..
Frontend/퍼블리싱 2022. 7. 22. 10:50
SCSS 문법 및 CSS 변환 방법

https://www.sassmeister.com/ SassMeister | The Sass Playground! SassMeister: The sassiest way to play with Sass, Compass, & LibSass! Loading... www.sassmeister.com https://seokzin.tistory.com/entry/SCSS-SCSS-%EB%AC%B8%EB%B2%95-%EC%A0%95%EB%A6%AC [SCSS] SCSS 문법 정리 프로젝트 규모가 커지고 복잡해질수록 순수 CSS의 한계를 많이 느끼게 됩니다. 그래서 SCSS나 CSS-in-JS의 도입은 사실상 필수가 되었습니다. 이 글을 통해 CSS의 문제점을 개선한 SCSS에 대해 알아보 seokzin.tistory..
Frontend/퍼블리싱 2022. 7. 20. 18:15
GSAP - Javascript Animation 라이브러리 사용 방법

https://greensock.com/gsap/ GSAP Timeline Tip: Understanding the Position Parameter The secret to building gorgeous sequences with precise timing is understanding the super-flexible "position" parameter which controls the placement of your tweens, labels, callbacks, pauses, and even neste greensock.com https://lpla.tistory.com/106 [GSAP] 애니메이션 사용법 (기초) GSAP? GSAP는 GrennSock에서 만든 자바스크립트 애니메이션 라이브..
Frontend/퍼블리싱 2022. 7. 20. 17:58
HTML 특수 기호(Entities) 표시 코드

https://www.w3schools.com/html/html_entities.asp HTML Entities W3Schools offers free online tutorials, references and exercises in all the major languages of the web. Covering popular subjects like HTML, CSS, JavaScript, Python, SQL, Java, and many, many more. www.w3schools.com https://tools.w3cub.com/html-entities Character Entity Reference Chart - W3cubTools Character Entity Reference Chart, s..
Frontend/퍼블리싱 2022. 7. 20. 17:39
Prev 1 2 Next