Movatterモバイル変換


[0]ホーム

URL:


Skip to content

Navigation Menu

Search code, repositories, users, issues, pull requests...

Provide feedback

We read every piece of feedback, and take your input very seriously.

Saved searches

Use saved searches to filter your results more quickly

Sign up
/puppyPublic template

Starter kit and delivery system for building static prototypes with Twig

License

NotificationsYou must be signed in to change notification settings

Upstatement/puppy

Repository files navigation

puppy-placeholder

{{ Your Next Great Prototype }}PrerequisitePrerequisite

{{ Your next great prototype description }}

📜 About

  • Pages are authored in HTML or, optionally,Twig and live in thesrc/pages directory.
  • Twig templates and partials live insrc/templates.
  • Site data files live insrc/data. Drop any.json,.yml, or.js file exporting a function into this directory and access the resulting data in Twig templates using{{ site.data['path/to/file.ext'] }}. Powered byPuppy.
  • Styles are authored withSass and live insrc/scss.
  • Javascripts live insrc/js. They are transipiled at build time withBabel so that they can take advantage ofmodern JS syntax
  • Any files in thepublic directory are copied to the web root recursively at build time.
  • Static assets are bundled at build time usingWebpack.
  • All source assets are pulled together withGulp and used to generate a static site in thedist directory.

✨ Install

# Install Node & NPM with [NVM](https://github.com/nvm-sh/nvm)nvm install# Install project dependenciesnpm install

👩‍💻 Usage

Development

# Start a local dev servernpm start# Check for JS/SCSS style violations prior to commitnpm run lint# Fix the fixable linter violationsnpm run lint:fix# Format code with Prettiernpm run format

Production

# Build for productionnpm run build# Serve locally using `serve`npx serve dist

Removing Tests

This repository includes some automatedtests that are not necessary when using Puppy as a starting template. To remove them, follow these steps:

  1. Remove ava from project dependenciesnpm uninstall --save-dev ava
  2. Remove thetest npm script
  3. Removeava config from package.json
  4. Remove thetest step in the GitHub workflow

Thumbnail Previews

You can capture screenshots of your pages by setting thethumbnail attribute toauto in your page's front matter header:

thumbnail:auto

The next time you runnpm run build a screenshot will be generated for that page and displayed in the prototype index.

If the automated screenshots aren't cutting it, you can provide your own by dropping an image into thepublic/thumbnails directory and referencing its name in your page's front matter header:

Page:src/pages/example.html

Thumbnail:public/screenshots/example.png

Front Matter:

thumbnail:example.png

Deployment

The output ofnpm run build is a static site. You can drop the resultingdist directory on any web server.

An excellent choice isNetlify. You can deploy your work to Netlify with theirCLI tool.

npm install netlify-cli -gnetlify initnetlify deploy

Examples & Links

Overview

📝 License

Copyright © 2020 Upstatement, LLC


APuppy 🐶 powered project


[8]ページ先頭

©2009-2025 Movatter.jp