Adds manifest.json to examples folder (#3536)

* Revert "Revert "[examples] Add manifest.json""

This reverts commit c65336e63b.

* Revert "Revert "Do not use now-examples anymore""

This reverts commit ac72e944a7.

* Update nowignore

* Fix join

* Fix JSON

* Fix header

* Replace manifest.json with @now/frameworks

* Adjust readmes

* Adjust .nowignore

* Update scully

* Fix description

* Update examples/create-react-app/src/App.js

Co-Authored-By: Shu Ding <ds303077135@gmail.com>

* Update readme

* Add websites

* Use https

* Adjust example URL

* Change order

Co-authored-by: Shu Ding <ds303077135@gmail.com>
This commit is contained in:
Andy
2020-01-10 00:14:51 +01:00
committed by GitHub
parent 7064f4ee40
commit 2db627b79d
91 changed files with 9364 additions and 561 deletions

View File

@@ -1,21 +1,25 @@
// Currently we read & parse the README file from zeit/now-examples
// TODO: create a `manifest.json` for zeit/now-examples
import Frameworks, { Framework } from '../../../packages/frameworks';
import fetch from 'node-fetch';
/**
* Fetch and parse the `Frameworks and Libraries` table
* in the README file of zeit/now-examples
*/
export async function getExampleList() {
const response = await fetch(
`https://raw.githubusercontent.com/zeit/now-examples/master/manifest.json`
);
if (response.status !== 200) {
console.log('manifest.json missing in zeit/now-examples');
return null;
}
return response.json();
interface Example {
example: string;
path: string;
demo: string;
description: string;
tagline: string;
framework: string;
}
export async function getExampleList(): Promise<Example[]> {
return (Frameworks as Framework[])
.filter(f => f.demo)
.map(framework => {
return {
example: framework.name,
path: `/${framework.slug}`,
demo: framework.demo,
description: framework.description,
tagline: framework.tagline,
framework: framework.slug,
};
});
}

View File

@@ -12,7 +12,7 @@ export async function getGitHubRepoInfo(repo: Repo) {
Accept: 'application/vnd.github.machine-man-preview+json',
// If we don't use a personal access token,
// it will get rate limited very easily.
Authorization: `Bearer ${process.env.GITHUB_ACCESS_TOKEN}`
Authorization: `Bearer ${process.env.GITHUB_ACCESS_TOKEN}`,
},
});
@@ -51,7 +51,9 @@ export async function getGitHubRepoInfo(repo: Repo) {
data.subdir = repo.path.slice(subdirPath.length).split('/');
}
if (data.id === 'zeit/now-examples' && data.subdir) {
const isExamples = data.id === 'zeit/now-examples' || data.id === 'zeit/now';
if (isExamples && data.subdir) {
// from our examples, add `homepage` and `description` fields
const example = data.subdir[0];
const exampleList = await getExampleList();
@@ -61,7 +63,6 @@ export async function getGitHubRepoInfo(repo: Repo) {
data.homepage = item.demo;
data.description = item.description;
data.exampleName = item.example;
data.icon = item.icon;
data.tagline = item.tagline;
data.framework = item.framework;
return data;

View File

@@ -21,6 +21,7 @@ export const mapOldToNew: { [key: string]: string[] } = {
'nuxt-static': ['nuxtjs'],
static: ['vanilla'],
typescript: ['gatsby-functions'],
umi: ['umijs'],
'vanilla-go': ['vanilla-functions'],
'vanilla-json-api': ['svelte-functions'],
'vue-ssr': ['vue'],

View File

@@ -51,14 +51,8 @@ export default withApiHandler(async function(req: NowRequest, res: NowResponse)
await extract('https://github.com/zeit/now-examples/archive/7c7b27e49b8b17d0d3f0e1604dc74fd005cd69e3.zip', TMP_DIR);
directory = `${TMP_DIR}/now-examples-7c7b27e49b8b17d0d3f0e1604dc74fd005cd69e3/${example}`;
} else {
await extract('https://github.com/zeit/now-examples/archive/master.zip', TMP_DIR);
directory = `${TMP_DIR}/now-examples-master/${example}`;
if (!isDirectory(directory)) {
// Use `now` instead of `now-examples` if the searched example does not exist
await extract('https://github.com/zeit/now/archive/master.zip', TMP_DIR);
directory = `${TMP_DIR}/now-master/examples/${example}`;
}
await extract('https://github.com/zeit/now/archive/master.zip', TMP_DIR);
directory = `${TMP_DIR}/now-master/examples/${example}`;
}
if (!isDirectory(directory)) {

View File

@@ -20,15 +20,8 @@ export default withApiHandler(async function(
return res.send(exampleList);
}
await Promise.all([
extract('https://github.com/zeit/now/archive/master.zip', '/tmp'),
extract('https://github.com/zeit/now-examples/archive/master.zip', '/tmp'),
]);
const exampleList = new Set([
...summary('/tmp/now-master/examples'),
...summary('/tmp/now-examples-master'),
]);
await extract('https://github.com/zeit/now/archive/master.zip', '/tmp');
const exampleList = summary('/tmp/now-master/examples');
const existingExamples = Array.from(exampleList).map(key => ({
name: key,

View File

@@ -1,4 +1,4 @@
![Angular Logo](../.github/images/angular.svg)
![Angular Logo](../packages/frameworks/logos/angular.svg)
# Angular Example

View File

@@ -1,28 +0,0 @@
# See https://help.github.com/articles/ignoring-files/ for more about ignoring files.
# dependencies
/node_modules
/.pnp
.pnp.js
# testing
/coverage
# production
/build
/dist
# misc
.DS_Store
.env.local
.env.development.local
.env.test.local
.env.production.local
npm-debug.log*
yarn-debug.log*
yarn-error.log*
# Environment Variables
.env
.env.build

View File

@@ -1,29 +0,0 @@
![React Logo](../.github/images/react.svg)
# React Example
This directory is a brief example of a [React](https://reactjs.org/) app with [Serverless Functions](https://zeit.co/docs/v2/serverless-functions/introduction) that can be deployed with ZEIT Now and zero configuration.
## Deploy Your Own
Deploy your own React project, along with Serverless Functions, with ZEIT Now.
[![Deploy with ZEIT Now](https://zeit.co/button)](https://zeit.co/new/project?template=https://github.com/zeit/now-examples/tree/master/create-react-app-functions)
_Live Example: https://create-react-app-functions.now-examples.now.sh/_
### How We Created This Example
To get started with React, along with [Serverless Functions](https://zeit.co/docs/v2/serverless-functions/introduction), with ZEIT Now, you can use the [Create-React-App CLI](https://reactjs.org/docs/create-a-new-react-app.html#create-react-app) to initialize the project:
```shell
$ npx create-react-app my-app
```
### Deploying From Your Terminal
You can deploy your new React project, along with [Serverless Functions](https://zeit.co/docs/v2/serverless-functions/introduction), with a single command from your terminal using [Now CLI](https://zeit.co/download):
```shell
$ now
```

View File

@@ -1,22 +0,0 @@
{
"name": "create-react-app",
"version": "0.1.0",
"private": true,
"dependencies": {
"react": "^16.6.1",
"react-dom": "^16.6.1",
"react-scripts": "2.1.1"
},
"scripts": {
"dev": "BROWSER=none react-scripts start",
"build": "react-scripts build",
"test": "react-scripts test",
"eject": "react-scripts eject"
},
"browserslist": [
">0.2%",
"not dead",
"not ie <= 11",
"not op_mini all"
]
}

View File

@@ -1,44 +0,0 @@
main {
align-content: center;
box-sizing: border-box;
display: grid;
font-family: 'SF Pro Text', 'SF Pro Icons', 'Helvetica Neue', 'Helvetica',
'Arial', sans-serif;
hyphens: auto;
line-height: 1.65;
margin: 0 auto;
max-width: 680px;
min-height: 100vh;
padding: 72px 0;
text-align: center;
}
h1 {
font-size: 45px;
}
h2 {
margin-top: 1.5em;
}
p {
font-size: 16px;
}
a {
border-bottom: 1px solid white;
color: #0076ff;
cursor: pointer;
text-decoration: none;
transition: all 0.2s ease;
}
a:hover {
border-bottom: 1px solid #0076ff;
}
code,
pre {
color: #d400ff;
font-family: Menlo, Monaco, Lucida Console, Liberation Mono, DejaVu Sans Mono,
Bitstream Vera Sans Mono, Courier New, monospace, serif;
font-size: 0.92em;
}
code:before,
code:after {
content: '\`';
}

View File

@@ -1,57 +0,0 @@
import React from 'react';
import { useEffect, useState } from 'react';
import './App.css';
function App() {
const [date, setDate] = useState(null);
useEffect(() => {
async function getDate() {
const res = await fetch('/api/date');
const newDate = await res.text();
setDate(newDate);
}
getDate();
}, []);
return (
<main>
<h1>Create React App + Go API</h1>
<h2>
Deployed with{' '}
<a
href="https://zeit.co/docs"
target="_blank"
rel="noreferrer noopener"
>
ZEIT Now
</a>
!
</h2>
<p>
<a
href="https://github.com/zeit/now-examples/tree/master/create-react-app-functions"
target="_blank"
rel="noreferrer noopener"
>
This project
</a>{' '}
was bootstrapped with{' '}
<a href="https://facebook.github.io/create-react-app/">
Create React App
</a>{' '}
and contains three directories, <code>/public</code> for static assets,{' '}
<code>/src</code> for components and content, and <code>/api</code>{' '}
which contains a serverless <a href="https://golang.org/">Go</a>{' '}
function. See{' '}
<a href="/api/date">
<code>api/date</code> for the Date API with Go
</a>
.
</p>
<br />
<h2>The date according to Go is:</h2>
<p>{date ? date : 'Loading date...'}</p>
</main>
);
}
export default App;

View File

@@ -1,9 +0,0 @@
import React from 'react';
import ReactDOM from 'react-dom';
import App from './App';
it('renders without crashing', () => {
const div = document.createElement('div');
ReactDOM.render(<App />, div);
ReactDOM.unmountComponentAtNode(div);
});

View File

@@ -1,14 +0,0 @@
body {
margin: 0;
padding: 0;
font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Oxygen",
"Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue",
sans-serif;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
}
code {
font-family: source-code-pro, Menlo, Monaco, Consolas, "Courier New",
monospace;
}

View File

@@ -1,12 +0,0 @@
import React from 'react';
import ReactDOM from 'react-dom';
import './index.css';
import App from './App';
import * as serviceWorker from './serviceWorker';
ReactDOM.render(<App />, document.getElementById('root'));
// If you want your app to work offline and load faster, you can change
// unregister() to register() below. Note this comes with some pitfalls.
// Learn more about service workers: http://bit.ly/CRA-PWA
serviceWorker.unregister();

View File

@@ -1,135 +0,0 @@
// This optional code is used to register a service worker.
// register() is not called by default.
// This lets the app load faster on subsequent visits in production, and gives
// it offline capabilities. However, it also means that developers (and users)
// will only see deployed updates on subsequent visits to a page, after all the
// existing tabs open on the page have been closed, since previously cached
// resources are updated in the background.
// To learn more about the benefits of this model and instructions on how to
// opt-in, read http://bit.ly/CRA-PWA
const isLocalhost = Boolean(
window.location.hostname === 'localhost' ||
// [::1] is the IPv6 localhost address.
window.location.hostname === '[::1]' ||
// 127.0.0.1/8 is considered localhost for IPv4.
window.location.hostname.match(
/^127(?:\.(?:25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?)){3}$/
)
);
export function register(config) {
if (process.env.NODE_ENV === 'production' && 'serviceWorker' in navigator) {
// The URL constructor is available in all browsers that support SW.
const publicUrl = new URL(process.env.PUBLIC_URL, window.location.href);
if (publicUrl.origin !== window.location.origin) {
// Our service worker won't work if PUBLIC_URL is on a different origin
// from what our page is served on. This might happen if a CDN is used to
// serve assets; see https://github.com/facebook/create-react-app/issues/2374
return;
}
window.addEventListener('load', () => {
const swUrl = `${process.env.PUBLIC_URL}/service-worker.js`;
if (isLocalhost) {
// This is running on localhost. Let's check if a service worker still exists or not.
checkValidServiceWorker(swUrl, config);
// Add some additional logging to localhost, pointing developers to the
// service worker/PWA documentation.
navigator.serviceWorker.ready.then(() => {
console.log(
'This web app is being served cache-first by a service ' +
'worker. To learn more, visit http://bit.ly/CRA-PWA'
);
});
} else {
// Is not localhost. Just register service worker
registerValidSW(swUrl, config);
}
});
}
}
function registerValidSW(swUrl, config) {
navigator.serviceWorker
.register(swUrl)
.then(registration => {
registration.onupdatefound = () => {
const installingWorker = registration.installing;
if (installingWorker == null) {
return;
}
installingWorker.onstatechange = () => {
if (installingWorker.state === 'installed') {
if (navigator.serviceWorker.controller) {
// At this point, the updated precached content has been fetched,
// but the previous service worker will still serve the older
// content until all client tabs are closed.
console.log(
'New content is available and will be used when all ' +
'tabs for this page are closed. See http://bit.ly/CRA-PWA.'
);
// Execute callback
if (config && config.onUpdate) {
config.onUpdate(registration);
}
} else {
// At this point, everything has been precached.
// It's the perfect time to display a
// "Content is cached for offline use." message.
console.log('Content is cached for offline use.');
// Execute callback
if (config && config.onSuccess) {
config.onSuccess(registration);
}
}
}
};
};
})
.catch(error => {
console.error('Error during service worker registration:', error);
});
}
function checkValidServiceWorker(swUrl, config) {
// Check if the service worker can be found. If it can't reload the page.
fetch(swUrl)
.then(response => {
// Ensure service worker exists, and that we really are getting a JS file.
const contentType = response.headers.get('content-type');
if (
response.status === 404 ||
(contentType != null && contentType.indexOf('javascript') === -1)
) {
// No service worker found. Probably a different app. Reload the page.
navigator.serviceWorker.ready.then(registration => {
registration.unregister().then(() => {
window.location.reload();
});
});
} else {
// Service worker found. Proceed as normal.
registerValidSW(swUrl, config);
}
})
.catch(() => {
console.log(
'No internet connection found. App is running in offline mode.'
);
});
}
export function unregister() {
if ('serviceWorker' in navigator) {
navigator.serviceWorker.ready.then(registration => {
registration.unregister();
});
}
}

View File

@@ -10,6 +10,7 @@
# production
/build
/dist
# misc
.DS_Store

View File

@@ -1,20 +1,20 @@
![React Logo](../.github/images/react.svg)
![React Logo](../packages/frameworks/logos/react.svg)
# Create-React-App Example
# React Example
This directory is a brief example of a [React](https://reactjs.org/) app that can be deployed with ZEIT Now and zero configuration.
This directory is a brief example of a [React](https://reactjs.org/) app with [Serverless Functions](https://zeit.co/docs/v2/serverless-functions/introduction) that can be deployed with ZEIT Now and zero configuration.
## Deploy Your Own
Deploy your own React project with ZEIT Now.
Deploy your own React project, along with Serverless Functions, with ZEIT Now.
[![Deploy with ZEIT Now](https://zeit.co/button)](https://zeit.co/new/project?template=https://github.com/zeit/now-examples/tree/master/create-react-app)
[![Deploy with ZEIT Now](https://zeit.co/button)](https://zeit.co/new/project?template=https://github.com/zeit/now-examples/tree/master/create-react-app-functions)
_Live Example: https://create-react-app.now-examples.now.sh_
_Live Example: https://create-react-app.now-examples.now.sh/_
### How We Created This Example
To get started with React, you can use the [Create-React-App CLI](https://reactjs.org/docs/create-a-new-react-app.html#create-react-app) to initialize the project:
To get started with React, along with [Serverless Functions](https://zeit.co/docs/v2/serverless-functions/introduction), with ZEIT Now, you can use the [Create-React-App CLI](https://reactjs.org/docs/create-a-new-react-app.html#create-react-app) to initialize the project:
```shell
$ npx create-react-app my-app
@@ -22,7 +22,7 @@ $ npx create-react-app my-app
### Deploying From Your Terminal
You can deploy your new React project with a single command from your terminal using [Now CLI](https://zeit.co/download):
You can deploy your new React project, along with [Serverless Functions](https://zeit.co/docs/v2/serverless-functions/introduction), with a single command from your terminal using [Now CLI](https://zeit.co/download):
```shell
$ now

View File

@@ -3,27 +3,20 @@
"version": "0.1.0",
"private": true,
"dependencies": {
"react": "^16.8.6",
"react-dom": "^16.8.6",
"react-scripts": "3.0.1"
"react": "^16.6.1",
"react-dom": "^16.6.1",
"react-scripts": "2.1.1"
},
"scripts": {
"start": "react-scripts start",
"dev": "react-scripts start",
"dev": "BROWSER=none react-scripts start",
"build": "react-scripts build",
"test": "react-scripts test",
"eject": "react-scripts eject"
},
"browserslist": {
"production": [
">0.2%",
"not dead",
"not op_mini all"
],
"development": [
"last 1 chrome version",
"last 1 firefox version",
"last 1 safari version"
]
}
"browserslist": [
">0.2%",
"not dead",
"not ie <= 11",
"not op_mini all"
]
}

View File

@@ -3,11 +3,14 @@
<head>
<meta charset="utf-8" />
<link rel="shortcut icon" href="%PUBLIC_URL%/favicon.ico" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<meta
name="viewport"
content="width=device-width, initial-scale=1, shrink-to-fit=no"
/>
<meta name="theme-color" content="#000000" />
<!--
manifest.json provides metadata used when your web app is installed on a
user's mobile device or desktop. See https://developers.google.com/web/fundamentals/web-app-manifest/
manifest.json provides metadata used when your web app is added to the
homescreen on Android. See https://developers.google.com/web/fundamentals/web-app-manifest/
-->
<link rel="manifest" href="%PUBLIC_URL%/manifest.json" />
<!--
@@ -19,10 +22,12 @@
work correctly both with client-side routing and a non-root public URL.
Learn how to configure a non-root public URL by running `npm run build`.
-->
<title>React App</title>
<title>Create React App + Go API</title>
</head>
<body>
<noscript>You need to enable JavaScript to run this app.</noscript>
<noscript>
You need to enable JavaScript to run this app.
</noscript>
<div id="root"></div>
<!--
This HTML file is a template.

View File

@@ -1,33 +1,44 @@
.App {
main {
align-content: center;
box-sizing: border-box;
display: grid;
font-family: 'SF Pro Text', 'SF Pro Icons', 'Helvetica Neue', 'Helvetica',
'Arial', sans-serif;
hyphens: auto;
line-height: 1.65;
margin: 0 auto;
max-width: 680px;
min-height: 100vh;
padding: 72px 0;
text-align: center;
}
.App-logo {
animation: App-logo-spin infinite 20s linear;
height: 40vmin;
pointer-events: none;
h1 {
font-size: 45px;
}
.App-header {
background-color: #282c34;
min-height: 100vh;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
font-size: calc(10px + 2vmin);
color: white;
h2 {
margin-top: 1.5em;
}
.App-link {
color: #61dafb;
p {
font-size: 16px;
}
@keyframes App-logo-spin {
from {
transform: rotate(0deg);
}
to {
transform: rotate(360deg);
}
a {
border-bottom: 1px solid white;
color: #0076ff;
cursor: pointer;
text-decoration: none;
transition: all 0.2s ease;
}
a:hover {
border-bottom: 1px solid #0076ff;
}
code,
pre {
color: #d400ff;
font-family: Menlo, Monaco, Lucida Console, Liberation Mono, DejaVu Sans Mono,
Bitstream Vera Sans Mono, Courier New, monospace, serif;
font-size: 0.92em;
}
code:before,
code:after {
content: '\`';
}

View File

@@ -1,25 +1,56 @@
import React from 'react';
import logo from './logo.svg';
import { useEffect, useState } from 'react';
import './App.css';
function App() {
const [date, setDate] = useState(null);
useEffect(() => {
async function getDate() {
const res = await fetch('/api/date');
const newDate = await res.text();
setDate(newDate);
}
getDate();
}, []);
return (
<div className="App">
<header className="App-header">
<img src={logo} className="App-logo" alt="logo" />
<p>
Edit <code>src/App.js</code> and save to reload.
</p>
<main>
<h1>Create React App + Go API</h1>
<h2>
Deployed with{' '}
<a
className="App-link"
href="https://reactjs.org"
href="https://zeit.co/docs"
target="_blank"
rel="noopener noreferrer"
rel="noreferrer noopener"
>
Learn React
ZEIT Now
</a>
</header>
</div>
!
</h2>
<p>
<a
href="https://github.com/zeit/now-examples/tree/master/create-react-app"
target="_blank"
rel="noreferrer noopener"
>
This project
</a>{' '}
was bootstrapped with{' '}
<a href="https://facebook.github.io/create-react-app/">
Create React App
</a>{' '}
and contains three directories, <code>/public</code> for static assets,{' '}
<code>/src</code> for components and content, and <code>/api</code>{' '}
which contains a serverless <a href="https://golang.org/">Go</a>{' '}
function. See{' '}
<a href="/api/date">
<code>api/date</code> for the Date API with Go
</a>
.
</p>
<br />
<h2>The date according to Go is:</h2>
<p>{date ? date : 'Loading date...'}</p>
</main>
);
}

View File

@@ -1,5 +1,6 @@
body {
margin: 0;
padding: 0;
font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Oxygen",
"Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue",
sans-serif;

View File

@@ -1,7 +0,0 @@
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 841.9 595.3">
<g fill="#61DAFB">
<path d="M666.3 296.5c0-32.5-40.7-63.3-103.1-82.4 14.4-63.6 8-114.2-20.2-130.4-6.5-3.8-14.1-5.6-22.4-5.6v22.3c4.6 0 8.3.9 11.4 2.6 13.6 7.8 19.5 37.5 14.9 75.7-1.1 9.4-2.9 19.3-5.1 29.4-19.6-4.8-41-8.5-63.5-10.9-13.5-18.5-27.5-35.3-41.6-50 32.6-30.3 63.2-46.9 84-46.9V78c-27.5 0-63.5 19.6-99.9 53.6-36.4-33.8-72.4-53.2-99.9-53.2v22.3c20.7 0 51.4 16.5 84 46.6-14 14.7-28 31.4-41.3 49.9-22.6 2.4-44 6.1-63.6 11-2.3-10-4-19.7-5.2-29-4.7-38.2 1.1-67.9 14.6-75.8 3-1.8 6.9-2.6 11.5-2.6V78.5c-8.4 0-16 1.8-22.6 5.6-28.1 16.2-34.4 66.7-19.9 130.1-62.2 19.2-102.7 49.9-102.7 82.3 0 32.5 40.7 63.3 103.1 82.4-14.4 63.6-8 114.2 20.2 130.4 6.5 3.8 14.1 5.6 22.5 5.6 27.5 0 63.5-19.6 99.9-53.6 36.4 33.8 72.4 53.2 99.9 53.2 8.4 0 16-1.8 22.6-5.6 28.1-16.2 34.4-66.7 19.9-130.1 62-19.1 102.5-49.9 102.5-82.3zm-130.2-66.7c-3.7 12.9-8.3 26.2-13.5 39.5-4.1-8-8.4-16-13.1-24-4.6-8-9.5-15.8-14.4-23.4 14.2 2.1 27.9 4.7 41 7.9zm-45.8 106.5c-7.8 13.5-15.8 26.3-24.1 38.2-14.9 1.3-30 2-45.2 2-15.1 0-30.2-.7-45-1.9-8.3-11.9-16.4-24.6-24.2-38-7.6-13.1-14.5-26.4-20.8-39.8 6.2-13.4 13.2-26.8 20.7-39.9 7.8-13.5 15.8-26.3 24.1-38.2 14.9-1.3 30-2 45.2-2 15.1 0 30.2.7 45 1.9 8.3 11.9 16.4 24.6 24.2 38 7.6 13.1 14.5 26.4 20.8 39.8-6.3 13.4-13.2 26.8-20.7 39.9zm32.3-13c5.4 13.4 10 26.8 13.8 39.8-13.1 3.2-26.9 5.9-41.2 8 4.9-7.7 9.8-15.6 14.4-23.7 4.6-8 8.9-16.1 13-24.1zM421.2 430c-9.3-9.6-18.6-20.3-27.8-32 9 .4 18.2.7 27.5.7 9.4 0 18.7-.2 27.8-.7-9 11.7-18.3 22.4-27.5 32zm-74.4-58.9c-14.2-2.1-27.9-4.7-41-7.9 3.7-12.9 8.3-26.2 13.5-39.5 4.1 8 8.4 16 13.1 24 4.7 8 9.5 15.8 14.4 23.4zM420.7 163c9.3 9.6 18.6 20.3 27.8 32-9-.4-18.2-.7-27.5-.7-9.4 0-18.7.2-27.8.7 9-11.7 18.3-22.4 27.5-32zm-74 58.9c-4.9 7.7-9.8 15.6-14.4 23.7-4.6 8-8.9 16-13 24-5.4-13.4-10-26.8-13.8-39.8 13.1-3.1 26.9-5.8 41.2-7.9zm-90.5 125.2c-35.4-15.1-58.3-34.9-58.3-50.6 0-15.7 22.9-35.6 58.3-50.6 8.6-3.7 18-7 27.7-10.1 5.7 19.6 13.2 40 22.5 60.9-9.2 20.8-16.6 41.1-22.2 60.6-9.9-3.1-19.3-6.5-28-10.2zM310 490c-13.6-7.8-19.5-37.5-14.9-75.7 1.1-9.4 2.9-19.3 5.1-29.4 19.6 4.8 41 8.5 63.5 10.9 13.5 18.5 27.5 35.3 41.6 50-32.6 30.3-63.2 46.9-84 46.9-4.5-.1-8.3-1-11.3-2.7zm237.2-76.2c4.7 38.2-1.1 67.9-14.6 75.8-3 1.8-6.9 2.6-11.5 2.6-20.7 0-51.4-16.5-84-46.6 14-14.7 28-31.4 41.3-49.9 22.6-2.4 44-6.1 63.6-11 2.3 10.1 4.1 19.8 5.2 29.1zm38.5-66.7c-8.6 3.7-18 7-27.7 10.1-5.7-19.6-13.2-40-22.5-60.9 9.2-20.8 16.6-41.1 22.2-60.6 9.9 3.1 19.3 6.5 28.1 10.2 35.4 15.1 58.3 34.9 58.3 50.6-.1 15.7-23 35.6-58.4 50.6zM320.8 78.4z"/>
<circle cx="420.9" cy="296.5" r="45.7"/>
<path d="M520.5 78.1z"/>
</g>
</svg>

Before

Width:  |  Height:  |  Size: 2.6 KiB

View File

@@ -43,7 +43,7 @@ export function register(config) {
navigator.serviceWorker.ready.then(() => {
console.log(
'This web app is being served cache-first by a service ' +
'worker. To learn more, visit https://bit.ly/CRA-PWA'
'worker. To learn more, visit http://bit.ly/CRA-PWA'
);
});
} else {
@@ -71,7 +71,7 @@ function registerValidSW(swUrl, config) {
// content until all client tabs are closed.
console.log(
'New content is available and will be used when all ' +
'tabs for this page are closed. See https://bit.ly/CRA-PWA.'
'tabs for this page are closed. See http://bit.ly/CRA-PWA.'
);
// Execute callback

View File

@@ -1,4 +1,4 @@
![Docusaurus Logo](../.github/images/docusaurus.svg)
![Docusaurus Logo](../packages/frameworks/logos/docusaurus.svg)
# Docusaurus Example

View File

@@ -1,4 +1,4 @@
![Eleventy Logo](../.github/images/eleventy.svg)
![Eleventy Logo](../packages/frameworks/logos/eleventy.svg)
# Eleventy Example

View File

@@ -1,4 +1,4 @@
![Gatsby Logo](../.github/images/gatsby.svg)
![Gatsby Logo](../packages/frameworks/logos/gatsby.svg)
# Gatsby Example

View File

@@ -1,4 +1,4 @@
![Gatsby Logo](../.github/images/gatsby.svg)
![Gatsby Logo](../packages/frameworks/logos/gatsby.svg)
# Gatsby Example

View File

@@ -1,4 +1,4 @@
![Gridsome Logo](../.github/images/gridsome.svg)
![Gridsome Logo](../packages/frameworks/logos/gridsome.svg)
# Gridsome Example

View File

@@ -1,4 +1,4 @@
![Hexo Logo](../.github/images/hexo.svg)
![Hexo Logo](../packages/frameworks/logos/hexo.svg)
# Hexo Example

View File

@@ -1,4 +1,4 @@
![Next.js Logo](../.github/images/next.svg)
![Next.js Logo](../packages/frameworks/logos/next.svg)
# Next.js Example

View File

@@ -1,4 +1,4 @@
![Polymer Logo](../.github/images/polymer.svg)
![Polymer Logo](../packages/frameworks/logos/polymer.svg)
# Polymer Example

View File

@@ -1,4 +1,4 @@
![Preact Logo](../.github/images/preact.svg)
![Preact Logo](../packages/frameworks/logos/preact.svg)
# Preact Example

View File

@@ -1,4 +1,4 @@
![Saber Logo](../.github/images/saber.svg)
![Saber Logo](../packages/frameworks/logos/saber.svg)
# Saber Example

View File

@@ -0,0 +1,4 @@
{
"repoId": "46af5832-8fee-459b-b18b-8bba203a5b1f",
"lastSync": 0
}

View File

@@ -0,0 +1,13 @@
# Editor configuration, see https://editorconfig.org
root = true
[*]
charset = utf-8
indent_style = space
indent_size = 2
insert_final_newline = true
trim_trailing_whitespace = true
[*.md]
max_line_length = off
trim_trailing_whitespace = false

46
examples/scully/.gitignore vendored Normal file
View File

@@ -0,0 +1,46 @@
# See http://help.github.com/ignore-files/ for more about ignoring files.
# compiled output
/dist
/tmp
/out-tsc
# Only exists if Bazel was run
/bazel-out
# dependencies
/node_modules
# profiling files
chrome-profiler-events*.json
speed-measure-plugin*.json
# IDEs and editors
/.idea
.project
.classpath
.c9/
*.launch
.settings/
*.sublime-workspace
# IDE - VSCode
.vscode/*
!.vscode/settings.json
!.vscode/tasks.json
!.vscode/launch.json
!.vscode/extensions.json
.history/*
# misc
/.sass-cache
/connect.lock
/coverage
/libpeerconnection.log
npm-debug.log
yarn-error.log
testem.log
/typings
# System Files
.DS_Store
Thumbs.db

View File

@@ -1,6 +1,6 @@
# Scully
This project was generated with [Angular CLI](https://github.com/angular/angular-cli) version 8.3.21.
This project was generated with [Angular CLI](https://github.com/angular/angular-cli).
## Development server

View File

@@ -18,7 +18,7 @@
"main": "src/main.ts",
"polyfills": "src/polyfills.ts",
"tsConfig": "tsconfig.app.json",
"aot": false,
"aot": true,
"assets": ["src/favicon.ico", "src/assets"],
"styles": ["src/styles.css"],
"scripts": []
@@ -36,7 +36,6 @@
"sourceMap": false,
"extractCss": true,
"namedChunks": false,
"aot": true,
"extractLicenses": true,
"vendorChunk": false,
"buildOptimizer": true,
@@ -110,5 +109,8 @@
}
}
},
"defaultProject": "scully"
"defaultProject": "scully",
"cli": {
"analytics": false
}
}

View File

@@ -0,0 +1,7 @@
---
title: First post
description: blog description
publish: false
---
# First post

View File

@@ -0,0 +1,7 @@
---
title: Second post
description: blog description
publish: false
---
# Second post

View File

@@ -16,7 +16,7 @@ module.exports = function(config) {
clearContext: false, // leave Jasmine Spec Runner output visible in browser
},
coverageIstanbulReporter: {
dir: require('path').join(__dirname, './coverage/scully'),
dir: require('path').join(__dirname, './coverage/scully-blog'),
reports: ['html', 'lcovonly', 'text-summary'],
fixWebpackSourcePaths: true,
},

View File

@@ -4,48 +4,47 @@
"scripts": {
"ng": "ng",
"start": "ng serve",
"build": "ng build",
"build": "ng build && scully",
"test": "ng test",
"lint": "ng lint",
"scully": "scully",
"scully:serve": "scully serve"
"scully": "scully"
},
"private": true,
"dependencies": {
"@angular/animations": "~8.2.14",
"@angular/common": "~8.2.14",
"@angular/compiler": "~8.2.14",
"@angular/core": "~8.2.14",
"@angular/forms": "~8.2.14",
"@angular/platform-browser": "~8.2.14",
"@angular/platform-browser-dynamic": "~8.2.14",
"@angular/router": "~8.2.14",
"@angular/animations": "~9.0.0-rc.7",
"@angular/common": "~9.0.0-rc.7",
"@angular/compiler": "~9.0.0-rc.7",
"@angular/core": "~9.0.0-rc.7",
"@angular/forms": "~9.0.0-rc.7",
"@angular/platform-browser": "~9.0.0-rc.7",
"@angular/platform-browser-dynamic": "~9.0.0-rc.7",
"@angular/router": "~9.0.0-rc.7",
"@scullyio/init": "0.0.9",
"@scullyio/ng-lib": "latest",
"@scullyio/scully": "latest",
"rxjs": "~6.4.0",
"tslib": "^1.10.0",
"zone.js": "~0.9.1"
"rxjs": "6.5.3",
"tslib": "1.10.0",
"zone.js": "~0.10.2"
},
"devDependencies": {
"@angular-devkit/build-angular": "~0.803.21",
"@angular/cli": "~8.3.21",
"@angular/compiler-cli": "~8.2.14",
"@angular/language-service": "~8.2.14",
"@types/node": "~8.9.4",
"@types/jasmine": "~3.3.8",
"@angular-devkit/build-angular": "~0.900.0-rc.7",
"@angular/cli": "~9.0.0-rc.7",
"@angular/compiler-cli": "~9.0.0-rc.7",
"@angular/language-service": "~9.0.0-rc.7",
"@types/node": "^12.11.1",
"@types/jasmine": "~3.5.0",
"@types/jasminewd2": "~2.0.3",
"codelyzer": "^5.0.0",
"jasmine-core": "~3.4.0",
"codelyzer": "^5.1.2",
"jasmine-core": "~3.5.0",
"jasmine-spec-reporter": "~4.2.1",
"karma": "~4.1.0",
"karma-chrome-launcher": "~2.2.0",
"karma-coverage-istanbul-reporter": "~2.0.1",
"karma": "~4.3.0",
"karma-chrome-launcher": "~3.1.0",
"karma-coverage-istanbul-reporter": "~2.1.0",
"karma-jasmine": "~2.0.1",
"karma-jasmine-html-reporter": "^1.4.0",
"protractor": "~5.4.0",
"ts-node": "~7.0.0",
"tslint": "~5.15.0",
"typescript": "~3.5.3"
"karma-jasmine-html-reporter": "^1.4.2",
"protractor": "~5.4.2",
"ts-node": "~8.3.0",
"tslint": "~5.18.0",
"typescript": "~3.6.4"
}
}

View File

@@ -1,4 +1,11 @@
exports.config = {
projectRoot: './src/app',
routes: {},
routes: {
'/blog/:slug': {
type: 'contentFolder',
slug: {
folder: './blog',
},
},
},
};

View File

@@ -0,0 +1,15 @@
import { NgModule } from '@angular/core';
import { Routes, RouterModule } from '@angular/router';
const routes: Routes = [
{
path: 'blog',
loadChildren: () => import('./blog/blog.module').then(m => m.BlogModule),
},
];
@NgModule({
imports: [RouterModule.forRoot(routes)],
exports: [RouterModule],
})
export class AppRoutingModule {}

View File

@@ -1,3 +1,9 @@
<div>
Scully on ZEIT Now.
</div>
<ul>
<li *ngFor="let post of posts$ | async">
<a [routerLink]="post.route">{{ post.title }}</a>
</li>
</ul>
<hr />
<router-outlet></router-outlet>

View File

@@ -1,31 +1,33 @@
import { TestBed, async } from '@angular/core/testing';
import { RouterTestingModule } from '@angular/router/testing';
import { AppComponent } from './app.component';
describe('AppComponent', () => {
beforeEach(async(() => {
TestBed.configureTestingModule({
imports: [RouterTestingModule],
declarations: [AppComponent],
}).compileComponents();
}));
it('should create the app', () => {
const fixture = TestBed.createComponent(AppComponent);
const app = fixture.debugElement.componentInstance;
const app = fixture.componentInstance;
expect(app).toBeTruthy();
});
it(`should have as title 'scully'`, () => {
it(`should have as title 'scully-blog'`, () => {
const fixture = TestBed.createComponent(AppComponent);
const app = fixture.debugElement.componentInstance;
expect(app.title).toEqual('scully');
const app = fixture.componentInstance;
expect(app.title).toEqual('scully-blog');
});
it('should render title', () => {
const fixture = TestBed.createComponent(AppComponent);
fixture.detectChanges();
const compiled = fixture.debugElement.nativeElement;
const compiled = fixture.nativeElement;
expect(compiled.querySelector('.content span').textContent).toContain(
'scully app is running!'
'scully-blog app is running!'
);
});
});

View File

@@ -1,12 +1,25 @@
import { IdleMonitorService } from '@scullyio/ng-lib';
import { Component } from '@angular/core';
import { Component, OnInit } from '@angular/core';
import { ScullyRoute, ScullyRoutesService } from '@scullyio/ng-lib';
import { Observable } from 'rxjs';
import { map } from 'rxjs/operators';
@Component({
selector: 'app-root',
templateUrl: './app.component.html',
styleUrls: ['./app.component.css'],
})
export class AppComponent {
constructor() {}
title = 'scully';
export class AppComponent implements OnInit {
posts$: Observable<ScullyRoute[]>;
constructor(private srs: ScullyRoutesService) {}
ngOnInit() {
this.posts$ = this.srs.available$.pipe(
map(routeList => {
return routeList.filter((route: ScullyRoute) =>
route.route.startsWith(`/blog/`)
);
})
);
}
}

View File

@@ -1,12 +1,13 @@
import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';
import { AppRoutingModule } from './app-routing.module';
import { AppComponent } from './app.component';
import { HttpClientModule } from '@angular/common/http';
@NgModule({
declarations: [AppComponent],
imports: [BrowserModule, HttpClientModule],
imports: [BrowserModule, AppRoutingModule, HttpClientModule],
providers: [],
bootstrap: [AppComponent],
})

View File

@@ -0,0 +1,17 @@
import { NgModule } from '@angular/core';
import { Routes, RouterModule } from '@angular/router';
import { BlogComponent } from './blog.component';
const routes: Routes = [
{
path: ':slug',
component: BlogComponent,
},
];
@NgModule({
imports: [RouterModule.forChild(routes)],
exports: [RouterModule],
})
export class BlogRoutingModule {}

View File

@@ -0,0 +1,10 @@
::slotted(h1) {
color:rgb(51, 6, 37);
background-color: rgb(248, 211, 236);
padding: 5px;
border-radius: 5px;
width: fit-content;
}

View File

@@ -0,0 +1,7 @@
<h3>ScullyIo content</h3>
<hr>
<!-- This is where Scully will inject the static HTML -->
<scully-content></scully-content>
<hr>
<h4>End of content</h4>

View File

@@ -0,0 +1,24 @@
import { async, ComponentFixture, TestBed } from '@angular/core/testing';
import { BlogComponent } from './Blog.component';
describe('BlogComponent', () => {
let component: BlogComponent;
let fixture: ComponentFixture<BlogComponent>;
beforeEach(async(() => {
TestBed.configureTestingModule({
declarations: [BlogComponent],
}).compileComponents();
}));
beforeEach(() => {
fixture = TestBed.createComponent(BlogComponent);
component = fixture.componentInstance;
fixture.detectChanges();
});
it('should create', () => {
expect(component).toBeTruthy();
});
});

View File

@@ -0,0 +1,17 @@
import { Component, OnInit, ViewEncapsulation } from '@angular/core';
import { ActivatedRoute, Router, ROUTES } from '@angular/router';
declare var ng: any;
@Component({
selector: 'app-blog',
templateUrl: './blog.component.html',
styleUrls: ['./blog.component.css'],
preserveWhitespaces: true,
encapsulation: ViewEncapsulation.Emulated,
})
export class BlogComponent implements OnInit {
ngOnInit() {}
constructor(private router: Router, private route: ActivatedRoute) {}
}

View File

@@ -0,0 +1,11 @@
import { CommonModule } from '@angular/common';
import { NgModule } from '@angular/core';
import { ComponentsModule } from '@scullyio/ng-lib';
import { BlogRoutingModule } from './blog-routing.module';
import { BlogComponent } from './blog.component';
@NgModule({
declarations: [BlogComponent],
imports: [CommonModule, BlogRoutingModule, ComponentsModule],
})
export class BlogModule {}

View File

@@ -1 +1,14 @@
[]
[
{
"route": "/blog/first-post",
"title": "First post",
"description": "blog description",
"publish": false
},
{
"route": "/blog/second-post",
"title": "Second post",
"description": "blog description",
"publish": false
}
]

View File

@@ -2,7 +2,7 @@
<html lang="en">
<head>
<meta charset="utf-8">
<title>Scully</title>
<title>Scully on ZEIT Now</title>
<base href="/">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="icon" type="image/x-icon" href="favicon.ico">

View File

@@ -0,0 +1,20 @@
// This file is required by karma.conf.js and loads recursively all the .spec and framework files
import 'zone.js/dist/zone-testing';
import { getTestBed } from '@angular/core/testing';
import {
BrowserDynamicTestingModule,
platformBrowserDynamicTesting,
} from '@angular/platform-browser-dynamic/testing';
declare const require: any;
// First, initialize the Angular testing environment.
getTestBed().initTestEnvironment(
BrowserDynamicTestingModule,
platformBrowserDynamicTesting()
);
// Then we find all the tests.
const context = require.context('./', true, /\.spec\.ts$/);
// And load the modules.
context.keys().map(context);

View File

@@ -5,6 +5,5 @@
"types": []
},
"files": ["src/main.ts", "src/polyfills.ts"],
"include": ["src/**/*.ts"],
"exclude": ["src/test.ts", "src/**/*.spec.ts"]
"include": ["src/**/*.d.ts"]
}

View File

@@ -2,7 +2,7 @@
"compileOnSave": false,
"compilerOptions": {
"baseUrl": "./",
"outDir": "./dist/out-tsc",
"outDir": "./dist",
"sourceMap": true,
"declaration": false,
"downlevelIteration": true,

8802
examples/scully/yarn.lock Normal file

File diff suppressed because it is too large Load Diff

View File

@@ -1,4 +1,4 @@
![Svelte Logo](../.github/images/svelte.svg)
![Svelte Logo](../packages/frameworks/logos/svelte.svg)
# Svelte Example

View File

@@ -1,2 +0,0 @@
BROWSER=none
ESLINT=1

View File

@@ -1,2 +0,0 @@
README.md
yarn.lock

View File

@@ -1,4 +1,4 @@
![UmiJS Logo](../.github/images/umi.svg)
![UmiJS Logo](../packages/frameworks/logos/umi.svg)
# UmiJS Example

View File

Before

Width:  |  Height:  |  Size: 177 KiB

After

Width:  |  Height:  |  Size: 177 KiB

View File

@@ -1,4 +1,4 @@
![Vue.js Logo](../.github/images/vue.svg)
![Vue.js Logo](../packages/frameworks/logos/vue.svg)
# Vue.js Example

View File

@@ -20,7 +20,7 @@
]
},
{
"source": "/api/examples",
"source": "/api/examples(.*)",
"headers": [
{
"key": "cache-control",

View File

@@ -2,8 +2,10 @@
{
"name": "Next.js",
"slug": "nextjs",
"demo": "https://nextjs.now-examples.now.sh",
"logo": "https://raw.githubusercontent.com/zeit/now/master/packages/frameworks/logos/next.svg",
"tagline": "Next.js makes you productive with React instantly — whether you want to build static or dynamic sites. ",
"description": "A Next.js app and a Serverless Function API.",
"website": "https://nextjs.org",
"detectors": {
"every": [
@@ -28,8 +30,10 @@
{
"name": "Gatsby",
"slug": "gatsby",
"demo": "https://gatsby-functions.now-examples.now.sh",
"logo": "https://raw.githubusercontent.com/zeit/now/master/packages/frameworks/logos/gatsby.svg",
"tagline": "Gatsby helps developers build blazing fast websites and apps with React.",
"description": "A Gatsby app, using the default starter theme and a Serverless Function API.",
"website": "https://gatsbyjs.org",
"detectors": {
"every": [
@@ -54,8 +58,10 @@
{
"name": "Hexo",
"slug": "hexo",
"demo": "https://hexo.now-examples.now.sh",
"logo": "https://raw.githubusercontent.com/zeit/now/master/packages/frameworks/logos/hexo.svg",
"tagline": "Hexo is a fast, simple & powerful blog framework powered by Node.js.",
"description": "A Hexo site, created with the Hexo CLI.",
"detectors": {
"every": [
{
@@ -79,8 +85,10 @@
{
"name": "Eleventy",
"slug": "eleventy",
"demo": "https://eleventy.now-examples.now.sh",
"logo": "https://raw.githubusercontent.com/zeit/now/master/packages/frameworks/logos/eleventy.svg",
"tagline": "11ty is a simpler static site generator written in JavaScript, created to be an alternative to Jekyll.",
"description": "An Eleventy site, created with npm init.",
"detectors": {
"every": [
{
@@ -104,8 +112,10 @@
{
"name": "Docusaurus",
"slug": "docusaurus",
"demo": "https://docusaurus.now-examples.now.sh",
"logo": "https://raw.githubusercontent.com/zeit/now/master/packages/frameworks/logos/docusaurus.svg",
"tagline": "Docusaurus makes it easy to maintain Open Source documentation websites.",
"description": "A static Docusaurus site that makes it easy to maintain OSS documentation.",
"detectors": {
"some": [
{
@@ -133,8 +143,10 @@
{
"name": "Preact",
"slug": "preact",
"demo": "https://preact.now-examples.now.sh",
"logo": "https://raw.githubusercontent.com/zeit/now/master/packages/frameworks/logos/preact.svg",
"tagline": "Preact is a fast 3kB alternative to React with the same modern API.",
"description": "A Preact app, created with the Preact CLI.",
"website": "https://preactjs.com",
"detectors": {
"every": [
@@ -159,8 +171,10 @@
{
"name": "Ember",
"slug": "ember",
"demo": "https://ember.now-examples.now.sh",
"logo": "https://raw.githubusercontent.com/zeit/now/master/packages/frameworks/logos/ember.svg",
"tagline": "Ember.js helps webapp developers be more productive out of the box.",
"description": "An Ember app, created with the Ember CLI.",
"detectors": {
"every": [
{
@@ -184,8 +198,10 @@
{
"name": "Vue.js",
"slug": "vue",
"demo": "https://vue.now-examples.now.sh",
"logo": "https://raw.githubusercontent.com/zeit/now/master/packages/frameworks/logos/vue.svg",
"tagline": "Vue.js is a versatile JavaScript framework that is as approachable as it is performant.",
"description": "A Vue.js app, created with the Vue CLI.",
"website": "https://vuejs.org",
"detectors": {
"every": [
@@ -210,7 +226,9 @@
{
"name": "Scully",
"slug": "scully",
"demo": "https://scully.now-examples.now.sh",
"tagline": "Scully is a static site generator for Angular.",
"description": "The Static Site Generator for Angular apps.",
"detectors": {
"every": [
{
@@ -234,8 +252,10 @@
{
"name": "Angular",
"slug": "angular",
"demo": "https://angular.now-examples.now.sh",
"logo": "https://raw.githubusercontent.com/zeit/now/master/packages/frameworks/logos/angular.svg",
"tagline": "Angular is a TypeScript-based cross-platform framework from Google.",
"description": "An Angular app, created with the Angular CLI.",
"website": "https://angular.io",
"detectors": {
"every": [
@@ -260,8 +280,10 @@
{
"name": "Polymer",
"slug": "polymer",
"demo": "https://polymer.now-examples.now.sh",
"logo": "https://raw.githubusercontent.com/zeit/now/master/packages/frameworks/logos/polymer.svg",
"tagline": "Polymer is an open-source webapps library from Google, for building using Web Components.",
"description": "A Polymer app, created with the Polymer CLI.",
"detectors": {
"every": [
{
@@ -285,8 +307,10 @@
{
"name": "Svelte",
"slug": "svelte",
"demo": "https://svelte-functions.now-examples.now.sh",
"logo": "https://raw.githubusercontent.com/zeit/now/master/packages/frameworks/logos/svelte.svg",
"tagline": "Svelte lets you write high performance reactive apps with significantly less boilerplate. ",
"description": "A Svelte app, using the Svelte template, and a Serverless Function API.",
"website": "https://svelte.dev",
"detectors": {
"every": [
@@ -311,8 +335,10 @@
{
"name": "Create React App",
"slug": "create-react-app",
"demo": "https://react-functions.now-examples.now.sh",
"logo": "https://raw.githubusercontent.com/zeit/now/master/packages/frameworks/logos/react.svg",
"tagline": "Create React App allows you to get going with React in no time.",
"description": "A React app, bootstrapped with create-react-app, and a Serverless Function API.",
"website": "https://create-react-app.dev",
"detectors": {
"some": [
@@ -341,8 +367,10 @@
{
"name": "Gridsome",
"slug": "gridsome",
"demo": "https://gridsome.now-examples.now.sh",
"logo": "https://raw.githubusercontent.com/zeit/now/master/packages/frameworks/logos/gridsome.svg",
"tagline": "Gridsome is a Vue.js-powered framework for building websites & apps that are fast by default.",
"description": "A Gridsome app, created with the Gridsome CLI.",
"detectors": {
"every": [
{
@@ -366,8 +394,10 @@
{
"name": "UmiJS",
"slug": "umijs",
"demo": "https://umijs.now-examples.now.sh",
"logo": "https://raw.githubusercontent.com/zeit/now/master/packages/frameworks/logos/umi.svg",
"tagline": "UmiJS is an extensible enterprise-level React application framework.",
"description": "An UmiJS app, created using the Umi CLI.",
"website": "https://umijs.org",
"detectors": {
"every": [
@@ -392,8 +422,10 @@
{
"name": "Sapper",
"slug": "sapper",
"demo": "https://sapper.now-examples.now.sh",
"logo": "https://raw.githubusercontent.com/zeit/now/master/packages/frameworks/logos/svelte.svg",
"tagline": "Sapper is a framework for building high-performance universal web apps with Svelte.",
"description": "A Sapper app, using the Sapper template.",
"website": "https://sapper.svelte.dev",
"detectors": {
"every": [
@@ -418,8 +450,10 @@
{
"name": "Saber",
"slug": "saber",
"demo": "https://saber.now-examples.now.sh",
"logo": "https://raw.githubusercontent.com/zeit/now/master/packages/frameworks/logos/saber.svg",
"tagline": "Saber is a framework for building static sites in Vue.js that supports data from any source.",
"description": "A Saber site, created with npm init.",
"detectors": {
"every": [
{
@@ -443,8 +477,10 @@
{
"name": "Stencil",
"slug": "stencil",
"demo": "https://stencil.now-examples.now.sh",
"logo": "https://raw.githubusercontent.com/zeit/now/master/packages/frameworks/logos/stencil.svg",
"tagline": "Stencil is a powerful toolchain for building Progressive Web Apps and Design Systems.",
"description": "A Stencil site, created with the Stencil CLI.",
"detectors": {
"every": [
{
@@ -468,8 +504,10 @@
{
"name": "Nuxt.js",
"slug": "nuxtjs",
"demo": "https://nuxtjs.now-examples.now.sh",
"logo": "https://raw.githubusercontent.com/zeit/now/master/packages/frameworks/logos/nuxt.svg",
"tagline": "Nuxt.js is the web comprehensive framework that lets you dream big with Vue.js.",
"description": "A Nuxt.js app, bootstrapped with create-nuxt-app.",
"website": "https://nuxtjs.org",
"detectors": {
"every": [
@@ -494,8 +532,10 @@
{
"name": "Hugo",
"slug": "hugo",
"demo": "https://hugo.now-examples.now.sh",
"logo": "https://raw.githubusercontent.com/zeit/now/master/packages/frameworks/logos/hugo.svg",
"tagline": "Hugo is the worlds fastest framework for building websites, written in Go.",
"description": "A Hugo site, created with the Hugo CLI.",
"website": "https://gohugo.io",
"detectors": {
"some": [
@@ -525,8 +565,10 @@
{
"name": "Jekyll",
"slug": "jekyll",
"demo": "https://jekyll.now-examples.now.sh",
"logo": "https://raw.githubusercontent.com/zeit/now/master/packages/frameworks/logos/jekyll.svg",
"tagline": "Jekyll makes it super easy to transform your plain text into static websites and blogs.",
"description": "A Jekyll site, created with the Jekyll CLI.",
"detectors": {
"every": [
{
@@ -549,8 +591,10 @@
{
"name": "Brunch",
"slug": "brunch",
"demo": "https://brunch.now-examples.now.sh",
"logo": "https://raw.githubusercontent.com/zeit/now/master/packages/frameworks/logos/brunch.svg",
"tagline": "Brunch is a fast and simple webapp build tool with seamless incremental compilation for rapid development.",
"description": "A Brunch app, created with the Brunch CLI.",
"detectors": {
"every": [
{
@@ -573,8 +617,10 @@
{
"name": "Middleman",
"slug": "middleman",
"demo": "https://middleman.now-examples.now.sh",
"logo": "https://raw.githubusercontent.com/zeit/now/master/packages/frameworks/logos/middleman.svg",
"tagline": "Middleman is a static site generator that uses all the shortcuts and tools in modern web development.",
"description": "A Middleman app, created with the Middleman CLI.",
"detectors": {
"every": [
{
@@ -597,112 +643,151 @@
{
"name": "Vanilla",
"slug": "vanilla",
"demo": "https://vanilla-functions.now-examples.now.sh",
"logo": "https://raw.githubusercontent.com/zeit/now/master/packages/frameworks/logos/vanilla.svg",
"tagline": "Love the original way of making websites?"
"tagline": "Love the original way of making websites?",
"description": "A vanilla site and a Serverless Function API."
},
{
"name": "Storybook",
"slug": "storybook",
"demo": "https://storybook.now-examples.now.sh",
"logo": "https://raw.githubusercontent.com/zeit/now/master/packages/frameworks/logos/storybook.svg",
"tagline": "Storybook is an open source tool for developing UI components in isolation for React, Vue, and Angular.",
"description": "A Storybook app, using the React demo template.",
"website": "https://storybook.js.org"
},
{
"name": "Docz",
"slug": "docz",
"demo": "https://docz.now-examples.now.sh",
"logo": "https://raw.githubusercontent.com/zeit/now/master/packages/frameworks/logos/docz.svg",
"tagline": "Docz makes it easy to write and publish beautiful interactive documentation for your code.",
"description": "A static Docz site that can be expanded upon to create documentation with ease.",
"website": "https://docz.site"
},
{
"name": "mdx-deck",
"slug": "mdx-deck",
"demo": "https://mdx-deck.now-examples.now.sh",
"logo": "https://raw.githubusercontent.com/zeit/now/master/packages/frameworks/logos/mdx-deck.svg",
"tagline": "MDX Deck allows you to swiftly create React MDX-based presentation decks.",
"description": "An mdx-deck presentation template that includes a theme.",
"website": "https://github.com/jxnblk/mdx-deck"
},
{
"name": "Aurelia",
"slug": "aurelia",
"demo": "https://aurelia.now-examples.now.sh",
"logo": "https://raw.githubusercontent.com/zeit/now/master/packages/frameworks/logos/aurelia.svg",
"tagline": "Aurelia is an all-in-one framework for building web, desktop, and mobile applications."
"tagline": "Aurelia is an all-in-one framework for building web, desktop, and mobile applications.",
"description": "An Aurelia app, created with the Aurelia CLI.",
"website": "https://aurelia.io"
},
{
"name": "VuePress",
"slug": "vuepress",
"demo": "https://vuepress.now-examples.now.sh",
"logo": "https://raw.githubusercontent.com/zeit/now/master/packages/frameworks/logos/vuepress.png",
"tagline": "VuePress is the performant way to create static sites with Vue.js."
"tagline": "VuePress is the performant way to create static sites with Vue.js.",
"description": "A VuePress app, created with the VuePress CLI.",
"website": "https://vuepress.vuejs.org"
},
{
"name": "Charge.js",
"slug": "charge",
"demo": "https://charge.now-examples.now.sh",
"logo": "https://raw.githubusercontent.com/zeit/now/master/packages/frameworks/logos/chargejs.svg",
"tagline": "Charge is an opinionated, zero-config static site generator written in JavaScript."
"tagline": "Charge is an opinionated, zero-config static site generator written in JavaScript.",
"description": "A Charge app to get you up and running."
},
{
"name": "Riot.js",
"slug": "riot",
"demo": "https://riot.now-examples.now.sh",
"logo": "https://raw.githubusercontent.com/zeit/now/master/packages/frameworks/logos/riot.svg",
"tagline": "Riot.js lets you build user interfaces with custom tags using simple and enjoyable syntax."
"tagline": "Riot.js lets you build user interfaces with custom tags using simple and enjoyable syntax.",
"description": "A Riot app to get you up and running."
},
{
"name": "Marko.js",
"slug": "marko",
"demo": "https://marko.now-examples.now.sh",
"logo": "https://raw.githubusercontent.com/zeit/now/master/packages/frameworks/logos/marko.png",
"tagline": "Marko is a super fast UI library that makes building web apps fun."
"tagline": "Marko is a super fast UI library that makes building web apps fun.",
"description": "A Marko app, created with the Marko CLI."
},
{
"name": "Mithril.js",
"slug": "mithril",
"demo": "https://mithril.now-examples.now.sh",
"logo": "https://raw.githubusercontent.com/zeit/now/master/packages/frameworks/logos/mithriljs.svg",
"tagline": "Mithril is a lightweight modern web framework for that makes it easy to build SPAs."
"tagline": "Mithril is a lightweight modern web framework for that makes it easy to build SPAs.",
"description": "A Mithril app to get you up and running."
},
{
"name": "Metalsmith",
"slug": "metalsmith",
"demo": "https://metalsmith.now-examples.now.sh",
"logo": "https://raw.githubusercontent.com/zeit/now/master/packages/frameworks/logos/metalsmith.png",
"tagline": "Metalsmith is an extremely simple, extendable static site generator."
"tagline": "Metalsmith is an extremely simple, extendable static site generator.",
"description": "A Metalsmith app, created using the static-site starter."
},
{
"name": "HyperApp",
"slug": "hyperapp",
"demo": "https://hyperapp.now-examples.now.sh",
"logo": "https://raw.githubusercontent.com/zeit/now/master/packages/frameworks/logos/hyperapp.svg",
"tagline": "HyperApp is a low-footprint framework for building web interfaces without a learning curve."
"tagline": "HyperApp is a low-footprint framework for building web interfaces without a learning curve.",
"description": "A HyperApp app to get you up and running."
},
{
"name": "Zola",
"slug": "zola",
"demo": "https://zola.now-examples.now.sh",
"logo": "https://raw.githubusercontent.com/zeit/now/master/packages/frameworks/logos/zola.svg",
"tagline": "Zola is a one-stop static site engine for all of your static needs."
"tagline": "Zola is a one-stop static site engine for all of your static needs.",
"description": "A Zola site, created with the Zola CLI."
},
{
"name": "Pelican",
"slug": "pelican",
"demo": "https://pelican.now-examples.now.sh",
"logo": "https://raw.githubusercontent.com/zeit/now/master/packages/frameworks/logos/pelican.png",
"tagline": "Pelican is a versatile static site generator, written in Python."
"tagline": "Pelican is a versatile static site generator, written in Python.",
"description": "A Pelican site, created with the Pelican CLI."
},
{
"name": "MkDocs",
"slug": "mkdocs",
"demo": "https://mkdocs.now-examples.now.sh",
"logo": "https://raw.githubusercontent.com/zeit/now/master/packages/frameworks/logos/mkdocs.svg",
"tagline": "MkDocs is a fast, simple and downright gorgeous static site generator that's geared towards building project documentation."
"tagline": "MkDocs is a fast, simple and downright gorgeous static site generator that's geared towards building project documentation.",
"description": "A MkDocs site, created with the MkDocs CLI."
},
{
"name": "Assemble",
"slug": "assemble",
"demo": "https://assemble.now-examples.now.sh",
"logo": "https://raw.githubusercontent.com/zeit/now/master/packages/frameworks/logos/assemble.svg",
"tagline": "A static site generator for Grunt.js and Yeoman, Assemble makes it dead simple to build modular sites and blogs."
"tagline": "A static site generator for Grunt.js and Yeoman, Assemble makes it dead simple to build modular sites and blogs.",
"description": "An Assemble site, created from the Assemble quickstart."
},
{
"name": "Ionic React",
"slug": "ionic-react",
"demo": "https://ionic-react.now-examples.now.sh",
"logo": "https://raw.githubusercontent.com/zeit/now/master/packages/frameworks/logos/ionic-react.svg",
"tagline": "Ionic React allows you to build mobile PWAs with React and the Ionic Framework."
"tagline": "Ionic React allows you to build mobile PWAs with React and the Ionic Framework.",
"description": "An Ionic React site, created with the Ionic CLI.",
"website": "https://ionicframework.com"
},
{
"name": "Foundation",
"slug": "foundation",
"demo": "https://foundation.now-examples.now.sh",
"logo": "https://raw.githubusercontent.com/zeit/now/master/packages/frameworks/logos/foundation.svg",
"tagline": "Foundation is the most advanced responsive front-end framework in the world."
"tagline": "Foundation is the most advanced responsive front-end framework in the world.",
"description": "A Foundation app, created with the Foundation CLI."
}
]

View File

@@ -3,14 +3,16 @@ export interface FrameworkDetectionItem {
matchContent?: string;
}
type Setting = { value: string } | { placeholder: string }
type Setting = { value: string } | { placeholder: string };
export interface Framework {
name: string;
slug: string;
logo: string;
demo: string;
tagline: string;
website: string;
description: string;
detectors?: {
every?: FrameworkDetectionItem[];
some?: FrameworkDetectionItem[];