Improve react example

Signed-off-by: Solomon Hykes <sh.github.6811@hykes.org>

examples/README.md

@@ -3,31 +3,46 @@
 All example commands should be executed in the `examples/` directory
 in an up-to-date checkout of the [dagger repository](https://github.com/dagger/dagger).
 
-## react-netlify: Deploy a React Web app to Netlify
+## react: Deploy a simple React application
 
-This example shows how to deploy an example React Application to Netlify,
+This example shows how to deploy an example React Application.
-using Dagger.
 
-1. Create a new deployment with the react-netlify deployment plan.
+Components:
+
+- [Netlify](https://netlify.com) for application hosting
+- [Yarn](https://yarnpkg.com) for building
+- [Github](https://github.com) for source code hosting
+- [React-Todo-App](https://github.com/kabirbaidhya/react-todo-app) by Kabir Baidhya as a sample application.
+
+1. Change the current directory to the example deployment plan
 
 ```sh
-dagger new --name example-one --base-dir ./react-netlify
+cd ./react
 ```
 
-2. Configure the deployment with your Netlify access token.
+2. Create a new deployment from the plan
+
+```sh
+dagger new
+```
+
+3. Configure the deployment with your Netlify access token.
 You can create new tokens from the [Netlify dashboard](https://app.netlify.com/user/applications/personal).
 
-
 ```sh
-dagger -d example-one input secret todoApp.account.token MY_TOKEN
+dagger input text www.account.token MY_TOKEN
 ```
 
-3. You can deploy updates at any time
+*NOTE: there is a dedicated command for encrypted secret inputs, but it is
+not yet implemented. Coming soon!*
+
+4. Deploy!
 
 ```sh
-dagger -d example-one up
+dagger up
 ```
 
+
 ## aws-eks: Kubernetes on AWS (EKS)
 
 This example provisions a Kubernetes (EKS) cluster on AWS using Cloudformation,

examples/react-netlify/main.cue

@@ -1,29 +0,0 @@
-package main
-
-import (
-	"dagger.io/netlify"
-	"dagger.io/yarn"
-	"dagger.io/git"
-)
-
-repository: git.#Repository & {
-	remote: "https://github.com/kabirbaidhya/react-todo-app.git"
-	ref:    "624041b17bd62292143f99bce474a0e3c2d2dd61"
-}
-
-todoApp: netlify.#Site & {
-	account: {
-		// Create an API token in your Netlify account settings
-		// https://app.netlify.com/user/applications/personal
-		//
-		// Fill using --input-string todoApp.account.token=XXX
-		token: string
-	}
-
-	name: "dagger-example-react-netlify"
-
-	contents: yarn.#Script & {
-		source: repository
-		run:    "build"
-	}
-}

examples/react/main.cue

@@ -0,0 +1,32 @@
+package main
+
+import (
+	"dagger.io/netlify"
+	"dagger.io/yarn"
+	"dagger.io/git"
+)
+
+// Source code of the sample application
+repo: git.#Repository & {
+	remote: "https://github.com/kabirbaidhya/react-todo-app.git"
+	ref:    "624041b17bd62292143f99bce474a0e3c2d2dd61"
+}
+
+// Host the application with Netlify
+www: netlify.#Site & {
+	// Site name can be overridden
+	name: string | *"dagger-example-react"
+
+	// Deploy the output of yarn build
+	// (Netlify build feature is not used, to avoid extra cost).
+	contents: build
+}
+
+// Build the application with Yarn
+build: yarn.#Script & {
+	// What to build
+	source: repo
+
+	// How to build it (name of yarn script)
+	run: "build"
+}