이번 섹션에서는 npm scope에 대해서 알아보고 이 scope 패키지를 통해서 어떻게 npm registry에 배포하는지 파악해보고 npm 패키지를 실제로 배포까지 해보도록하자.npm에는 scope라는 개념이 존재한다.
npm의 scope 개념은 조직 또는 그룹이다. 우리는 이 scope를 통해서 협업이 가능하며, 여러개의 분산된 패키지를 하나의 조직으로 관리 또는 배포 할 수 있다.

Continue reading

예제를 통하여 npm 패키지를 생성하고 생성된 npm 패키지를 NPM Repostory에 배포까지 배움으로 인해 오픈소스로서 NPM 생태계에 기여하는 방법을 배워보자.이번 포스팅에서는 npm 모듈 혹은 npm 패키지를 생성하여 실제로 NPM Registry에 업로드까지 하여 오픈소스로서 NPM 생태계에 기여하는 방법을 배워보자.
우리가 오픈 소스를 만들고 싶거나 관리를 하고 싶다면 git hub에 오픈소스를 올리는 것에는 한계가 있다. 우리가 오픈 소스를 만드는 목적은 공유제공이라 생각한다. 내가 만든 것을 남에게 공유하고 이런 오픈 소스가 필요한 사람에게는 쉽게 접해서 사용할 수 있게끔 하는 것이다. 그렇기 때문에 git hub에 올리는 것을 넘어서 npm 패키지로 모듈화하여 NPM Registry에 올리는 것이 필요하다. 지금부터 npm 패키지를 만들고 배포하는 방법을 배워보자.

Continue reading

이전 섹션인 Lerna를 활용한 Mono-Repo 구축 완벽 가이드 - 개념 정리 에서 LernaMono-Repo에 대한 개념을 파악하였다. 이번 섹션에서는 실제로 lerna를 활용하여 간단하게 log를 출력하는 패키지를 Mono-Repo로 구성해 보고 NPM Registry에 배포까지 해보자.예제는 CLI를 통해 간단한 로그를 출력하는 패키지Lerna를 활용한 Mono-Repo 구조로 구축, 개발, 배포까지 진행할 것이다.

Continue reading

mono-repo 구축을 위한 가이드! mono-repomulti-repo의 차이를 알아보고 mono-repo 구축을 위한 도구인 lerna를 살펴보자.먼저 mono-repo에 대한 개념을 다지고 mono-repo의 장단점을 면밀히 살펴본 후 lerna를 파악해보자. 이 후 섹션에서는 Lerna를 활용한 Mono-Repo 구축 완벽 가이드 - 예제를 통한 완벽 파악을 통해 lerna의 사용법을 예제를 통해서 정확하게 알아보자.

Continue reading

우리는 항상 Icon-Font를 오픈 소스를 통해 사용만 해 왔고 오픈 소스에 없는 Icon은 PNG로 직접 만들어 사용해 왔다. 하지만 이 Web Icon Font 제작 방법의 포스팅을 보고 앞으로 PNG가 아닌 Web Icon Font를 직접 제작해서 사용해보자. 이번 포스트에서는 매일 가져다가 쓰지 않으며 Image Sprite를 통해서 Image Icon을 사용하지 않는 직접 web icon font를 만들어서 사용하는 방법에 대해 알아보자.흔히 아는 Material-Icon, Font-Awesome, Ionic-Icon은 SVG를 토대로 font 형식으로 생성하여 사용되는 web icon font이다.
보통 위 icon set을 가져다가 쓰겠지만 프로젝트를 하면서 내가 원하는 아이콘이 없다면 어떡할까? 대부분 아이콘은 png로 제작되고 icon font를 생성하여 만들지 않는다.
이번 포스트에서는 매일 가져다가 쓰지 않으며 Image Sprite를 통해서 Image Icon을 사용하지 않는 직접 web icon font를 만들어서 사용하는 방법에 대해 알아보자.

Continue reading
  • page 1 of 1
Author's picture

Dev. DY

Web Front-End Technology Lab


Front-End Developer


Republic of Korea, Seoul