Skip to content

Commit 5aaf90e

Browse files
authored
Update README.md
1 parent 278f3ce commit 5aaf90e

File tree

1 file changed

+14
-12
lines changed

1 file changed

+14
-12
lines changed

README.md

Lines changed: 14 additions & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -1,28 +1,27 @@
11
## Create-React-App-Lambda
22

3-
This project is a reference demo showing you how to use [Create React App v3](https://github.com/facebookincubator/create-react-app) and [netlify-lambda v1](https://github.com/netlify/netlify-lambda) together in a [Netlify Dev](https://github.com/netlify/netlify-dev-plugin) workflow.
3+
This project is a reference demo showing you how to use [Create React App v3](https://github.com/facebookincubator/create-react-app) and [netlify-lambda v1](https://github.com/netlify/netlify-lambda) together in a [Netlify Dev](https://github.com/netlify/netlify-dev-plugin) workflow. You can clone this and immediately be productive with a React app with serverless Netlify Functions in the same repo. Alternatively you can depoy straight to Netlify with this one-click Deploy:
44

5-
⚠️NOTE: You may not need this project at all. [Netlify Dev](https://github.com/netlify/netlify-dev-plugin) already works with `create-react-app` out of the box! **Only use `netlify-lambda` if you need a build step for your functions** [See its README for details](https://github.com/netlify/netlify-lambda/blob/master/README.md#netlify-lambda), eg if you want to use Babel or TypeScript.
65

7-
## Project Setup
6+
[![Deploy to Netlify](https://www.netlify.com/img/deploy/button.svg)](https://app.netlify.com/start/deploy?repository=https://github.com/netlify/create-react-app-lambda)
87

9-
Source: The main addition to base Create-React-App is a new folder: `src/lambda`. This folder is specified and can be changed in the `package.json` script: `"build:lambda": "netlify-lambda build src/lambda"`.
8+
> ⚠️NOTE: You may not need this project at all. [Netlify Dev](https://github.com/netlify/netlify-dev-plugin) works with `create-react-app` out of the box! Only use `netlify-lambda` if you need a build step for your functions, eg if you want to use Babel or TypeScript ([see its README for details](https://github.com/netlify/netlify-lambda/blob/master/README.md#netlify-lambda)).
109
11-
Dist: Each JavaScript file in there will be built for Lambda function deployment in `/built-lambda`, specified in [`netlify.toml`](https://www.netlify.com/docs/netlify-toml-reference/).
10+
## Project Setup
1211

13-
As an example, we've included a small `src/lambda/hello.js` function, which will be deployed to `/.netlify/functions/hello`. We've also included an async lambda example using async/await syntax in `async-dadjoke.js`.
12+
**Source**: The main addition to base Create-React-App is a new folder: `src/lambda`. This folder is specified and can be changed in the `package.json` script: `"build:lambda": "netlify-lambda build src/lambda"`.
1413

15-
Your functions will be available locally at
14+
**Dist**: Each JavaScript file in there will be built for Netlify Function deployment in `/built-lambda`, specified in [`netlify.toml`](https://www.netlify.com/docs/netlify-toml-reference/).
1615

17-
[![Deploy to Netlify](https://www.netlify.com/img/deploy/button.svg)](https://app.netlify.com/start/deploy?repository=https://github.com/netlify/create-react-app-lambda)
16+
As an example, we've included a small `src/lambda/hello.js` function, which will be deployed to `/.netlify/functions/hello`. We've also included an async lambda example using async/await syntax in `async-dadjoke.js`.
1817

1918
## Video
2019

2120
Learn how to set this up yourself (and why everything is the way it is) from scratch in a video: https://www.youtube.com/watch?v=3ldSM98nCHI
2221

2322
## Babel/webpack compilation
2423

25-
All functions are compiled with webpack using the Babel Loader, so you can use modern JavaScript, import npm modules, etc., without any extra setup.
24+
All functions (inside `src/lambda`) are compiled with webpack using Babel, so you can use modern JavaScript, import npm modules, etc., without any extra setup.
2625

2726
## Local Development
2827

@@ -34,7 +33,7 @@ cd create-react-app-lambda ## change into this repo
3433
yarn # install all dependencies
3534

3635
## done every time you start up this project
37-
ntl dev ## nice shortcut for `neltify dev`
36+
ntl dev ## nice shortcut for `netlify dev`, starts up create-react-app AND a local Node.js server for your Netlify functions
3837
```
3938

4039
This fires up [Netlify Dev](https://github.com/netlify/netlify-dev-plugin/), which:
@@ -44,7 +43,10 @@ This fires up [Netlify Dev](https://github.com/netlify/netlify-dev-plugin/), whi
4443

4544
You can view the project locally via Netlify Dev, via `localhost:8888`.
4645

47-
Each function will be available at the same port as well: `http://localhost:8888/.netlify/functions/hello` and `http://localhost:8888/.netlify/functions/async-dadjoke`.
46+
Each function will be available at the same port as well:
47+
48+
- `http://localhost:8888/.netlify/functions/hello` and
49+
- `http://localhost:8888/.netlify/functions/async-dadjoke`
4850

4951
## Deployment
5052

@@ -97,7 +99,7 @@ You are free to set up your `tsconfig.json` and `tslint` as you see fit.
9799

98100
**If you want to try working in Typescript on the client and lambda side**: There are a bunch of small setup details to get right. Check https://github.com/sw-yx/create-react-app-lambda-typescript for a working starter.
99101

100-
## Routing and authentication
102+
## Routing and authentication with Netlify Identity
101103

102104
For a full demo of routing and authentication, check this branch: https://github.com/netlify/create-react-app-lambda/pull/18 This example will not be maintained but may be helpful.
103105

0 commit comments

Comments
 (0)
pFad - Phonifier reborn

Pfad - The Proxy pFad of © 2024 Garber Painting. All rights reserved.

Note: This service is not intended for secure transactions such as banking, social media, email, or purchasing. Use at your own risk. We assume no liability whatsoever for broken pages.


Alternative Proxies:

Alternative Proxy

pFad Proxy

pFad v3 Proxy

pFad v4 Proxy