Skip to content
This repository was archived by the owner on Sep 12, 2019. It is now read-only.

Commit 9194705

Browse files
author
sw-yx
committed
add readme
1 parent aff2f73 commit 9194705

File tree

1 file changed

+69
-51
lines changed

1 file changed

+69
-51
lines changed

README.md

Lines changed: 69 additions & 51 deletions
Original file line numberDiff line numberDiff line change
@@ -54,7 +54,7 @@ netlify plugins:link .
5454

5555
Now you're both ready to start testing netlify dev and to contribute to the project.
5656

57-
### Netlify Dev usage
57+
## Netlify Dev usage
5858

5959
```bash
6060
USAGE
@@ -68,7 +68,7 @@ OPTIONS
6868
-l, --live Start a public live session
6969

7070
DESCRIPTION
71-
The dev command will run a local dev server with Netlify's proxy and redirect rules
71+
The dev command will run a local dev server with Netlify's Edge Logic proxies and redirects, serverless functions, and addons
7272
7373
EXAMPLES
7474
$ netlify dev
@@ -79,28 +79,7 @@ COMMANDS
7979
dev:exec Exec command
8080
```
8181
82-
### Redirects
83-
84-
Netlify Dev has the ability emulate the [redirect capability](https://www.netlify.com/docs/redirects/) Netlify provide on the [ADN](https://netlify.com/features/adn) in your local environment. The same redirect rules which you configure to run on the edge, will also work in your local builds.
85-
86-
Netlify dev supports redirect rules defined in either `_redirects` or `netlify.toml` files.
87-
88-
The order of precedence for applying redirect rules is:
89-
90-
1. `_redirects` file (in the project's publish folder)
91-
1. `netlify.toml` file (in the project's publish folder)
92-
1. `netlify.toml` file (in the project's root folder)
93-
94-
See the [Redirects Documentation](https://www.netlify.com/docs/redirects/) for more information on Netlify's redirect and proxying capabilities.
95-
96-
#### Running the project and accessing redirects
97-
98-
```bash
99-
# Build, serve and hot-reload changes
100-
$ netlify dev
101-
```
102-
103-
### Project detection
82+
## Project detection
10483
10584
Netlify Dev will attempt to detect the SSG or build command that you are using, and run these on your behalf, while adding other development utilities.
10685
@@ -112,10 +91,19 @@ Netlify Dev will attempt to detect the SSG or build command that you are using,
11291
[dev]
11392
command = "yarn start" # Command to start your dev server
11493
port = 3000 # Port that the dev server will be listening on
115-
publish = "dist" # Folder with the static content for _redirect file
94+
publish = "dist" # If you use a _redirect file, provide the path to your static content folder
11695
```
11796
118-
**Explanation of detectors and ports in Netlify Dev**: There will be a number of ports that you will encounter when using Netlify Dev, especially when runnign a static site generator like Gatsby which has its own dev server. All the port numbers can be a bit confusing, so here is a brief explainer. If your SSG has a devserver on port 8000 for example, Netlify Dev needs to be told to proxy that port so it can merge it in with the rest of the local Netlify environment (say, running on port 8888), which is what you want to get the full Netlify Dev experience with Functions, Redirects, and so on. If you're running a project we have a detector for, we hardcode those conventional ports so you don't have to supply it yourself. However, sometimes you're using some other project (we welcome contributions for detectors!) or just have a custom port you want Netlify Dev to point to for some reason. This is when you go to the `netlify.toml` `[dev]` block to specify exactly what port we should listen to.
97+
<details>
98+
<summary>
99+
<b>Explanation of detectors and ports in Netlify Dev</b>
100+
</summary>
101+
102+
There will be a number of ports that you will encounter when using Netlify Dev, especially when running a static site generator like Gatsby which has its own dev server. All the port numbers can be a bit confusing, so here is a brief explainer.
103+
104+
- If your SSG has a devserver on port 8000 for example, Netlify Dev needs to be told to proxy that port so it can merge it in with the rest of the local Netlify environment (say, running on port 8888), which is what you want to get the full Netlify Dev experience with Functions, Redirects, and so on.
105+
- If you're running a project we have a detector for, we hardcode those conventional ports so you don't have to supply it yourself.
106+
- However, sometimes you're using some other project (we welcome contributions for detectors!) or just have a custom port you want Netlify Dev to point to for some reason. This is when you go to the `netlify.toml` `[dev]` block to specify exactly what port we should listen to.
119107

120108
As for which port to use while doing local development in Netlify Dev, always look for this box in your console output and use that:
121109

@@ -127,7 +115,23 @@ As for which port to use while doing local development in Netlify Dev, always lo
127115
└──────────────────────────────────────────────────────────────┘
128116
```
129117

130-
### Netlify Functions
118+
</details>
119+
120+
## Redirects
121+
122+
Netlify Dev has the ability emulate the [redirect capability](https://www.netlify.com/docs/redirects/) Netlify provide on the [ADN](https://netlify.com/features/adn) in your local environment. The same redirect rules which you configure to run on the edge, will also work in your local builds.
123+
124+
Netlify dev supports redirect rules defined in either `_redirects` or `netlify.toml` files.
125+
126+
The order of precedence for applying redirect rules is:
127+
128+
1. `_redirects` file (in the project's publish folder)
129+
1. `netlify.toml` file (in the project's publish folder)
130+
1. `netlify.toml` file (in the project's root folder)
131+
132+
See the [Redirects Documentation](https://www.netlify.com/docs/redirects/) for more information on Netlify's redirect and proxying capabilities.
133+
134+
## Netlify Functions
131135

132136
Netlify can also create serverless functions for you locally as part of Netlify Functions. The serverless functions can then be run by Netlify Dev in the same way that wold be when deployed to the cloud.
133137

@@ -155,52 +159,48 @@ $ netlify functions:create --name hello-world # same
155159
$ netlify functions:create hello-world --url https://github.com/netlify-labs/all-the-functions/tree/master/functions/9-using-middleware
156160
```
157161

158-
**Function Templates**
162+
**Writing your own Function Templates**
159163

160164
Function templates can specify `addons` that they rely on as well as execute arbitrary code after installation in an `onComplete` hook, if a special `.netlify-function-template.js` file exists in the directory:
161165

162166
```js
163167
// .netlify-function-template.js
164168
module.exports = {
165-
addons: ["fauna"],
169+
addons: [
170+
{
171+
addonName: "fauna",
172+
addonDidInstall: () => {} // post install function to run after installing addon, eg. for setting up schema
173+
}
174+
],
166175
onComplete() {
167176
console.log(`custom-template function created from template!`);
168177
}
169178
};
170179
```
171180
172-
#### Executing Netlify Functions
181+
Instead of using our basic templates, you can use your own by passing it with a --url flag: `netlify functions:create hello-world --url https://github.com/netlify-labs/all-the-functions/tree/master/functions/9-using-middleware`, specifying any addons and postinstall/complete steps as shown above.
173182
174-
After creating serverless functions, Netlify Dev can serve them to you as part of your local build. This emulates the behaviour of Netlify Functions when deployed to Netlify.
183+
#### Function Builders, Function Builder Detection, and Relationship with `netlify-lambda`
175184
176-
```bash
177-
# Build, serve and hot-reload changes
178-
$ netlify dev
179-
```
185+
**Why Function Builders**
180186
181-
Each serverless function will be exposed on a URL corresponding to its path and file name.
187+
Notice that all the functions created and mentioned so far require no build step. This is intentional: we want to remain agnostic of build tooling and thereby create clear expectations: You give us a folder of functions, and we simply serve it (This is called [`zip-it-and-ship-it`](https://github.com/netlify/zip-it-and-ship-it)). If you want to build that folder from a separate source folder, that is entirely under your control. Use whatever tool you like.
182188
183-
`./functions/hello-world.js` -> `http://localhost:{PORT}/.netlify/functions/hello-world`
189+
This can be helpful, for example, to use ES modules syntax (e.g. `import`/`export`) via webpack, babel transforms via `babel-cli` or `babel-loader`, or strict type-checking and transpilation with TypeScript's `tsc` or other webpack loaders.
184190
185-
`./functions/my-api/hello-world.js` -> `http://localhost:{PORT}/.netlify/functions/my-api/hello-world`
191+
We'll call this category of tools **function builders**. In fact, we do maintain an open source function builder dedicated to the task of transforming serverless functions from source to destination via webpack, called [`netlify-lambda`](https://github.com/netlify/netlify-lambda).
186192
187-
### Using Add-ons
193+
**Function Builder Detection**
188194
189-
Add-ons are a way for Netlify users to extend the functionality of their Jamstack site/app.
195+
We don't expect everyone to use function builders, but we expect many will, and want to provide helpful defaults that "just work" for this. To do that, we use a similar detection concept to [project detectors](#Project-detection), and look for common function builder setups.
190196
191-
[Add-on docs](https://www.netlify.com/docs/partner-add-ons/).
197+
Currently, we only offer detection for scripts with `netlify-lambda build $SRCFOLDER`. More ideas are welcome.
192198
193-
To try out an add-on with Netlify dev, run the `netlify addons:create` command:
199+
Netlify Dev will watch `netlify-lambda`'s source folder and rebuild whenever the source file changes, eliminating the need for `netlify-lambda serve` since we dont want a duplicate functions server.
194200
195-
```bash
196-
netlify addons:create fauna
197-
```
201+
**Bring Your Own Function Builder**
198202
199-
The above command will install the FaunaDB add-on and provision a noSQL database for your site to leverage. The FaunaDB add-on injects environment variables into your site's build process and the serverless functions.
200-
201-
Or install this [one click example](https://github.com/netlify/fauna-one-click).
202-
203-
After you have installed an add-on, it will be visible with the `netlify addons:list` command inside your site's current working directory.
203+
We may offer first class support for function builder detection in future, and also let you specify function build commands in the `netlify.toml` `[dev]` block. Please share your usecase with us if you are likely to need this.
204204
205205
## Live Share
206206
@@ -212,4 +212,22 @@ netlify dev --live
212212
213213
You will get a URL that looks like `https://clever-cray-2aa156-6639f3.netlify.live/`. This can be accessed by anyone as long as you keep your session open.
214214
215-
> Note: there are currently known issues with ending the live session alongside your webdevserver. We are working on fixing it. In the mean time you can run `ps aux | grep live-tunnel` and kill these sessions manually.
215+
> Note: there are currently known issues with ending the live session alongside your webdevserver, as well as with live reloading. We are working on fixing it, and would appreciate repro cases. In the mean time you can run `ps aux | grep live-tunnel` and kill these sessions manually.
216+
217+
### Using Add-ons
218+
219+
Add-ons are a way for Netlify users to extend the functionality of their Jamstack site/app.
220+
221+
Check out [Add-on docs](https://www.netlify.com/docs/partner-add-ons/) here.
222+
223+
To try out an add-on with Netlify dev, run the `netlify addons:create` command:
224+
225+
```bash
226+
netlify addons:create fauna
227+
```
228+
229+
The above command will install the FaunaDB add-on and provision a noSQL database for your site to leverage. The FaunaDB add-on injects environment variables into your site's build process and the serverless functions.
230+
231+
Or install this [one click example](https://github.com/netlify/fauna-one-click).
232+
233+
After you have installed an add-on, it will be visible with the `netlify addons:list` command inside your site's current working directory. You can use `netlify addons:delete $ADDONNAME` to delete your addon instance.

0 commit comments

Comments
 (0)