JAMstack 앱 - 오픈 소스 및 자동화 도구로 구축

안녕하세요 코더 여러분,

이 기사에서는 HTML5Up 및 Creative-Tim 에이전시에서 제공하는 일부 잘 알려진 디자인 위에 자동화 도구를 사용하여 구축된 오픈 소스JAMStack 앱이 포함된 선별된 목록을 제시합니다.

Thanks for reading! - Content provided by App Generator.

자동화 프로세스는 아래 나열된 몇 단계를 루프로 실행합니다.

플랫 HTML 디자인은 기존 JAMstack 상용구와 호환되도록 구문 분석 및 정규화됩니다(이 단계는 별도의 문서 - )

처리된 디자인을 스크립 및 빌더(gulp, sass 처리 .. 등)가 이미 장착된 JAMstack 상용구에 주입합니다

.

무언가 잘못된 경우(잘못된 경로, 누락된 이미지) 앱을 시작하고 루프에서 이전 단계를 반복합니다

.

이 간단한 워크플로를 사용하면 고객이 요청한 새로운 디자인을 사용하여 새 프로젝트를 시작할 때 수동 작업을 건너뛸 수 있습니다.

JAM스택이 필요한 이유

수년 동안 Php 및 Python 프레임워크를 사용한 후 사실에 기반한 간단한 앱 및 단일 페이지 웹사이트에 대해 JAMstack 패턴으로 전환하기로 결정했습니다.

대부분의 경우 데이터베이스

가 필요하지 않습니다.

속도 문제

모든 디자인을 JAMstack boilerplate code에 쉽게 통합할 수 있습니다.

배포가 자동화됨

앱은 일반 HTML로 생성되기 때문에 100% 안전합니다

.

JAMStack 종이 키트

이 애플리케이션은 Creative-Tim에서 제공하는 아름다운 UI 키트 위에 구축되었습니다. 상용구는 샘플 페이지(랜딩, 로그인 및 등록)와 함께 제공되며 라이선스는 MIT입니다.

앱 링크

JAMstack Paper demo

JAMstack Paper sources

소스에서 빌드

$ git clone https://github.com/app-generator/jamstack-paper-kit.git
$ cd jamstack-paper-kit
$ yarn
$ yarn start
$ yarn build

JAMStack 아르곤 디자인

Argon 디자인 디자인은 Creative-Tim에서 MIT 라이선스로 출시한 또 다른 무료 UI 키트입니다.

앱 링크

JAMstack Paper demo

JAMstack Paper sources

소스에서 빌드

$ git clone https://github.com/app-generator/jamstack-argon-design-system.git
$ cd jamstack-argon-design-system
$ yarn
$ yarn start
$ yarn build

JAMStack 프랙탈

HTML5Up Fractal 디자인의 오픈 소스 앱 - CCA 3.0 라이선스(Html5up에서 상속됨)

앱 링크

JAMstack Fractal demo

JAMstack Fractal sources

소스에서 빌드

$ git clone https://github.com/app-generator/jamstack-fractal.git
$ cd jamstack-fractal
$ yarn
$ yarn start
$ yarn build

JAMStack 큰 그림

HTML5Up BigPicture 디자인의 오픈 소스 앱 - CCA 3.0 라이선스(Html5up에서 상속됨).

앱 링크

JAMstack BigPicture demo

JAMstack BigPicture sources

소스에서 빌드

$ git clone https://github.com/app-generator/jamstack-big-picture.git
$ cd jamstack-big-picture
$ yarn
$ yarn start
$ yarn build

JAMStack 착륙

HTML5Up Landed 디자인의 오픈 소스 앱 - CCA 3.0 라이선스.

앱 링크

JAMstack Landed demo

JAMstack Landed sources

소스에서 빌드

$ git clone https://github.com/app-generator/jamstack-landed.git
$ cd jamstack-landed
$ yarn
$ yarn start
$ yarn build

JAMStack Now UI 키트

Now UI 디자인 - MIT 라이선스 위에 JAMstack 패턴으로 코딩된 놀랍도록 빠른 애플리케이션.

앱 링크

JAMstack Now UI demo

JAMstack Now UI sources

소스에서 빌드

$ git clone https://github.com/app-generator/jamstack-now-ui-kit.git
$ cd jamstack-now-ui-kit
$ yarn
$ yarn start
$ yarn build

JAMStack 재료 키트

Material Kit 설계 - MIT 라이센스 위에 JAMstack 패턴으로 코딩된 매우 빠른 애플리케이션.

앱 링크

JAMstack Material Kit demo

JAMstack Material Kit sources

소스에서 빌드

$ git clone git clone https://github.com/app-generator/jamstack-material-kit.git
$ cd jamstack-material-kit
$ yarn
$ yarn start
$ yarn build

더 많은 JAMstack 앱

BulmaLanding - MIT 라이선스

BulmaPlay - MIT 라이선스

기타 JAMstack 리소스

JAMstack - 공식 웹사이트

WTF is JAMstack - JAMstack 관련 웹사이트

JAMstack apps - AppSeed에서 제공하는 인덱스

Thank You!