From 0f0e36e8e0714ffdef57beeefc64dc5c238f6909 Mon Sep 17 00:00:00 2001 From: Rob Cameron Date: Mon, 13 Jun 2022 10:29:15 -0700 Subject: [PATCH 1/8] Add Mailchimp signup form --- docs/docs/tutorial/foreword.md | 39 --------- docs/docs/tutorial/foreword.mdx | 136 ++++++++++++++++++++++++++++++++ 2 files changed, 136 insertions(+), 39 deletions(-) delete mode 100644 docs/docs/tutorial/foreword.md create mode 100644 docs/docs/tutorial/foreword.mdx diff --git a/docs/docs/tutorial/foreword.md b/docs/docs/tutorial/foreword.md deleted file mode 100644 index 16e1b0fffb11..000000000000 --- a/docs/docs/tutorial/foreword.md +++ /dev/null @@ -1,39 +0,0 @@ -# RedwoodJS: The Tutorial - -Welcome to Redwood! If you haven't yet, check out the [Redwood README](https://github.com/redwoodjs/redwood/blob/main/README.md) to get a little background on why we created Redwood and the problems it's meant to solve. Redwood brings several existing technologies together for the first time into what we think is the future of database-backed single page applications. - -In this tutorial we're going to build a blog engine. In reality a blog is probably not the ideal candidate for a Redwood app: blog articles can be stored in a CMS and statically generated to HTML files and served as flat files from a CDN (the classic [Jamstack](https://jamstack.org/) use case). But as most developers are familiar with a blog, and it uses all of the features we want to demonstrate, we decided to build one anyway. - -If you went through an earlier version of this tutorial you may remember it being split into parts 1 and 2. That was an artifact of the fact that most features demonstrated in part 2 didn't exist in the framework when part 1 was written. Once they were added we created part 2 to contain just those new features. Now that everything is integrated and working well we've moved each section into logically grouped chapters. - -## Callouts - -You'll find some callouts throughout the text to draw your attention: - -:::tip - -They might look like this... - -::: - -:::caution - -or sometimes like this... - -::: - -:::danger - -or maybe even like this! - -::: - -It's usually something that goes into more detail about a specific point, refers you to further reading, or calls out something important you should know. Here comes one now: - -:::info - -This tutorial assumes you are using version 1.0.0 or greater of RedwoodJS. - -::: - -Let's get started! diff --git a/docs/docs/tutorial/foreword.mdx b/docs/docs/tutorial/foreword.mdx new file mode 100644 index 000000000000..368f2707503b --- /dev/null +++ b/docs/docs/tutorial/foreword.mdx @@ -0,0 +1,136 @@ +import { useEffect } from 'react' + +export const MailchimpForm = () => { + useEffect(() => { + const script = document.createElement('script') + script.src = '//s3.amazonaws.com/downloads.mailchimp.com/js/mc-validate.js' + document.body.appendChild(script) + + return () => document.body.removeChild(script) + }, []) + + return ( + <> +
+
+
+
+ + +
+
+
+
+
+ +
+
+
+ + ) +} + +# RedwoodJS: The Tutorial + +Welcome to Redwood! If you haven't yet, check out the [Redwood README](https://github.com/redwoodjs/redwood/blob/main/README.md) to get a little background on why we created Redwood and the problems it's meant to solve. Redwood brings several existing technologies together for the first time into what we think is the future of database-backed single page applications. + +In this tutorial we're going to build a blog engine. In reality a blog is probably not the ideal candidate for a Redwood app: blog articles can be stored in a CMS and statically generated to HTML files and served as flat files from a CDN (the classic [Jamstack](https://jamstack.org/) use case). But as most developers are familiar with a blog, and it uses all of the features we want to demonstrate, we decided to build one anyway. + +If you went through an earlier version of this tutorial you may remember it being split into parts 1 and 2. That was an artifact of the fact that most features demonstrated in part 2 didn't exist in the framework when part 1 was written. Once they were added we created part 2 to contain just those new features. Now that everything is integrated and working well we've moved each section into logically grouped chapters. + +## Sign Up for Tutorial Reminders + +There's a new Javascript framework coming out every week, we know it can be hard to keep up. If you'd like some non-spammy emails reminding you to go through the tutorial, give us your email below: + + + +## Callouts + +You'll find some callouts throughout the text to draw your attention: + +:::tip + +They might look like this... + +::: + +:::caution + +or sometimes like this... + +::: + +:::danger + +or maybe even like this! + +::: + +It's usually something that goes into more detail about a specific point, refers you to further reading, or calls out something important you should know. Here comes one now: + +:::info + +This tutorial assumes you are using version 1.0.0 or greater of RedwoodJS. + +::: + +Let's get started! From 3b5a1f7fc06e22c54ed10db0125cae7ef6de3876 Mon Sep 17 00:00:00 2001 From: Rob Cameron Date: Mon, 13 Jun 2022 10:29:22 -0700 Subject: [PATCH 2/8] Update link --- docs/docs/quick-start.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/docs/docs/quick-start.md b/docs/docs/quick-start.md index 79036bddcc53..765a38120418 100644 --- a/docs/docs/quick-start.md +++ b/docs/docs/quick-start.md @@ -129,4 +129,4 @@ yarn rw setup auth --help ## Next Steps -The best way to learn Redwood is by going through the comprehensive [tutorial](tutorial/foreword.md) and joining the community (via the [Discourse forum](https://community.redwoodjs.com) or the [Discord server](https://discord.gg/redwoodjs)). +The best way to learn Redwood is by going through the comprehensive [tutorial](tutorial/foreword.mdx) and joining the community (via the [Discourse forum](https://community.redwoodjs.com) or the [Discord server](https://discord.gg/redwoodjs)). From 8dac4b46e89dcf3d1bad74a85a654dcd50c68c46 Mon Sep 17 00:00:00 2001 From: Rob Cameron Date: Mon, 13 Jun 2022 10:34:58 -0700 Subject: [PATCH 3/8] Rename back --- docs/docs/tutorial/foreword.md | 39 +++++++++ docs/docs/tutorial/foreword.mdx | 136 -------------------------------- 2 files changed, 39 insertions(+), 136 deletions(-) create mode 100644 docs/docs/tutorial/foreword.md delete mode 100644 docs/docs/tutorial/foreword.mdx diff --git a/docs/docs/tutorial/foreword.md b/docs/docs/tutorial/foreword.md new file mode 100644 index 000000000000..16e1b0fffb11 --- /dev/null +++ b/docs/docs/tutorial/foreword.md @@ -0,0 +1,39 @@ +# RedwoodJS: The Tutorial + +Welcome to Redwood! If you haven't yet, check out the [Redwood README](https://github.com/redwoodjs/redwood/blob/main/README.md) to get a little background on why we created Redwood and the problems it's meant to solve. Redwood brings several existing technologies together for the first time into what we think is the future of database-backed single page applications. + +In this tutorial we're going to build a blog engine. In reality a blog is probably not the ideal candidate for a Redwood app: blog articles can be stored in a CMS and statically generated to HTML files and served as flat files from a CDN (the classic [Jamstack](https://jamstack.org/) use case). But as most developers are familiar with a blog, and it uses all of the features we want to demonstrate, we decided to build one anyway. + +If you went through an earlier version of this tutorial you may remember it being split into parts 1 and 2. That was an artifact of the fact that most features demonstrated in part 2 didn't exist in the framework when part 1 was written. Once they were added we created part 2 to contain just those new features. Now that everything is integrated and working well we've moved each section into logically grouped chapters. + +## Callouts + +You'll find some callouts throughout the text to draw your attention: + +:::tip + +They might look like this... + +::: + +:::caution + +or sometimes like this... + +::: + +:::danger + +or maybe even like this! + +::: + +It's usually something that goes into more detail about a specific point, refers you to further reading, or calls out something important you should know. Here comes one now: + +:::info + +This tutorial assumes you are using version 1.0.0 or greater of RedwoodJS. + +::: + +Let's get started! diff --git a/docs/docs/tutorial/foreword.mdx b/docs/docs/tutorial/foreword.mdx deleted file mode 100644 index 368f2707503b..000000000000 --- a/docs/docs/tutorial/foreword.mdx +++ /dev/null @@ -1,136 +0,0 @@ -import { useEffect } from 'react' - -export const MailchimpForm = () => { - useEffect(() => { - const script = document.createElement('script') - script.src = '//s3.amazonaws.com/downloads.mailchimp.com/js/mc-validate.js' - document.body.appendChild(script) - - return () => document.body.removeChild(script) - }, []) - - return ( - <> -
-
-
-
- - -
-
-
-
-
- -
-
-
- - ) -} - -# RedwoodJS: The Tutorial - -Welcome to Redwood! If you haven't yet, check out the [Redwood README](https://github.com/redwoodjs/redwood/blob/main/README.md) to get a little background on why we created Redwood and the problems it's meant to solve. Redwood brings several existing technologies together for the first time into what we think is the future of database-backed single page applications. - -In this tutorial we're going to build a blog engine. In reality a blog is probably not the ideal candidate for a Redwood app: blog articles can be stored in a CMS and statically generated to HTML files and served as flat files from a CDN (the classic [Jamstack](https://jamstack.org/) use case). But as most developers are familiar with a blog, and it uses all of the features we want to demonstrate, we decided to build one anyway. - -If you went through an earlier version of this tutorial you may remember it being split into parts 1 and 2. That was an artifact of the fact that most features demonstrated in part 2 didn't exist in the framework when part 1 was written. Once they were added we created part 2 to contain just those new features. Now that everything is integrated and working well we've moved each section into logically grouped chapters. - -## Sign Up for Tutorial Reminders - -There's a new Javascript framework coming out every week, we know it can be hard to keep up. If you'd like some non-spammy emails reminding you to go through the tutorial, give us your email below: - - - -## Callouts - -You'll find some callouts throughout the text to draw your attention: - -:::tip - -They might look like this... - -::: - -:::caution - -or sometimes like this... - -::: - -:::danger - -or maybe even like this! - -::: - -It's usually something that goes into more detail about a specific point, refers you to further reading, or calls out something important you should know. Here comes one now: - -:::info - -This tutorial assumes you are using version 1.0.0 or greater of RedwoodJS. - -::: - -Let's get started! From 9fbdeb048a6a78c4db5114cb9c55f3e54df6921a Mon Sep 17 00:00:00 2001 From: Rob Cameron Date: Mon, 13 Jun 2022 10:35:08 -0700 Subject: [PATCH 4/8] Add form directly to 1.5 versioned docs --- .../version-1.5/tutorial/foreword.md | 72 +++++++++++++++++++ 1 file changed, 72 insertions(+) diff --git a/docs/versioned_docs/version-1.5/tutorial/foreword.md b/docs/versioned_docs/version-1.5/tutorial/foreword.md index 16e1b0fffb11..2b3509efcb99 100644 --- a/docs/versioned_docs/version-1.5/tutorial/foreword.md +++ b/docs/versioned_docs/version-1.5/tutorial/foreword.md @@ -1,3 +1,69 @@ +import { useEffect } from 'react' + +export const MailchimpForm = () => { + useEffect(() => { + const script = document.createElement('script') + script.src = '//s3.amazonaws.com/downloads.mailchimp.com/js/mc-validate.js' + document.body.appendChild(script) + + return () => document.body.removeChild(script) + }, []) + + return ( + <> +
+
+
+
+ + +
+
+
+
+
+ +
+
+
+ + ) +} + # RedwoodJS: The Tutorial Welcome to Redwood! If you haven't yet, check out the [Redwood README](https://github.com/redwoodjs/redwood/blob/main/README.md) to get a little background on why we created Redwood and the problems it's meant to solve. Redwood brings several existing technologies together for the first time into what we think is the future of database-backed single page applications. @@ -6,6 +72,12 @@ In this tutorial we're going to build a blog engine. In reality a blog is probab If you went through an earlier version of this tutorial you may remember it being split into parts 1 and 2. That was an artifact of the fact that most features demonstrated in part 2 didn't exist in the framework when part 1 was written. Once they were added we created part 2 to contain just those new features. Now that everything is integrated and working well we've moved each section into logically grouped chapters. +## Sign Up for Tutorial Reminders + +There's a new Javascript framework coming out every week, we know it can be hard to keep up. If you'd like some non-spammy emails reminding you to go through the tutorial, give us your email below: + + + ## Callouts You'll find some callouts throughout the text to draw your attention: From db2a0c44adf88db2d9647f6cb156b47601748e6c Mon Sep 17 00:00:00 2001 From: Rob Cameron Date: Mon, 13 Jun 2022 10:38:15 -0700 Subject: [PATCH 5/8] Fix link --- docs/docs/quick-start.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/docs/docs/quick-start.md b/docs/docs/quick-start.md index 765a38120418..79036bddcc53 100644 --- a/docs/docs/quick-start.md +++ b/docs/docs/quick-start.md @@ -129,4 +129,4 @@ yarn rw setup auth --help ## Next Steps -The best way to learn Redwood is by going through the comprehensive [tutorial](tutorial/foreword.mdx) and joining the community (via the [Discourse forum](https://community.redwoodjs.com) or the [Discord server](https://discord.gg/redwoodjs)). +The best way to learn Redwood is by going through the comprehensive [tutorial](tutorial/foreword.md) and joining the community (via the [Discourse forum](https://community.redwoodjs.com) or the [Discord server](https://discord.gg/redwoodjs)). From 8e7bfc827ebc6fb0d133256639a885e3264c9657 Mon Sep 17 00:00:00 2001 From: Rob Cameron Date: Mon, 13 Jun 2022 11:29:47 -0700 Subject: [PATCH 6/8] Move signup form to root /docs dir --- docs/docs/tutorial/foreword.md | 72 +++++++++++++++++++ .../version-1.5/tutorial/foreword.md | 72 ------------------- 2 files changed, 72 insertions(+), 72 deletions(-) diff --git a/docs/docs/tutorial/foreword.md b/docs/docs/tutorial/foreword.md index 16e1b0fffb11..2b3509efcb99 100644 --- a/docs/docs/tutorial/foreword.md +++ b/docs/docs/tutorial/foreword.md @@ -1,3 +1,69 @@ +import { useEffect } from 'react' + +export const MailchimpForm = () => { + useEffect(() => { + const script = document.createElement('script') + script.src = '//s3.amazonaws.com/downloads.mailchimp.com/js/mc-validate.js' + document.body.appendChild(script) + + return () => document.body.removeChild(script) + }, []) + + return ( + <> +
+
+
+
+ + +
+
+
+
+
+ +
+
+
+ + ) +} + # RedwoodJS: The Tutorial Welcome to Redwood! If you haven't yet, check out the [Redwood README](https://github.com/redwoodjs/redwood/blob/main/README.md) to get a little background on why we created Redwood and the problems it's meant to solve. Redwood brings several existing technologies together for the first time into what we think is the future of database-backed single page applications. @@ -6,6 +72,12 @@ In this tutorial we're going to build a blog engine. In reality a blog is probab If you went through an earlier version of this tutorial you may remember it being split into parts 1 and 2. That was an artifact of the fact that most features demonstrated in part 2 didn't exist in the framework when part 1 was written. Once they were added we created part 2 to contain just those new features. Now that everything is integrated and working well we've moved each section into logically grouped chapters. +## Sign Up for Tutorial Reminders + +There's a new Javascript framework coming out every week, we know it can be hard to keep up. If you'd like some non-spammy emails reminding you to go through the tutorial, give us your email below: + + + ## Callouts You'll find some callouts throughout the text to draw your attention: diff --git a/docs/versioned_docs/version-1.5/tutorial/foreword.md b/docs/versioned_docs/version-1.5/tutorial/foreword.md index 2b3509efcb99..16e1b0fffb11 100644 --- a/docs/versioned_docs/version-1.5/tutorial/foreword.md +++ b/docs/versioned_docs/version-1.5/tutorial/foreword.md @@ -1,69 +1,3 @@ -import { useEffect } from 'react' - -export const MailchimpForm = () => { - useEffect(() => { - const script = document.createElement('script') - script.src = '//s3.amazonaws.com/downloads.mailchimp.com/js/mc-validate.js' - document.body.appendChild(script) - - return () => document.body.removeChild(script) - }, []) - - return ( - <> -
-
-
-
- - -
-
-
-
-
- -
-
-
- - ) -} - # RedwoodJS: The Tutorial Welcome to Redwood! If you haven't yet, check out the [Redwood README](https://github.com/redwoodjs/redwood/blob/main/README.md) to get a little background on why we created Redwood and the problems it's meant to solve. Redwood brings several existing technologies together for the first time into what we think is the future of database-backed single page applications. @@ -72,12 +6,6 @@ In this tutorial we're going to build a blog engine. In reality a blog is probab If you went through an earlier version of this tutorial you may remember it being split into parts 1 and 2. That was an artifact of the fact that most features demonstrated in part 2 didn't exist in the framework when part 1 was written. Once they were added we created part 2 to contain just those new features. Now that everything is integrated and working well we've moved each section into logically grouped chapters. -## Sign Up for Tutorial Reminders - -There's a new Javascript framework coming out every week, we know it can be hard to keep up. If you'd like some non-spammy emails reminding you to go through the tutorial, give us your email below: - - - ## Callouts You'll find some callouts throughout the text to draw your attention: From b3937a64020c78cbcd8cd0216eb1e3a1ebe509de Mon Sep 17 00:00:00 2001 From: Rob Cameron Date: Mon, 13 Jun 2022 11:34:40 -0700 Subject: [PATCH 7/8] Also add to 1.5 --- .../version-1.5/tutorial/foreword.md | 72 +++++++++++++++++++ 1 file changed, 72 insertions(+) diff --git a/docs/versioned_docs/version-1.5/tutorial/foreword.md b/docs/versioned_docs/version-1.5/tutorial/foreword.md index 16e1b0fffb11..2b3509efcb99 100644 --- a/docs/versioned_docs/version-1.5/tutorial/foreword.md +++ b/docs/versioned_docs/version-1.5/tutorial/foreword.md @@ -1,3 +1,69 @@ +import { useEffect } from 'react' + +export const MailchimpForm = () => { + useEffect(() => { + const script = document.createElement('script') + script.src = '//s3.amazonaws.com/downloads.mailchimp.com/js/mc-validate.js' + document.body.appendChild(script) + + return () => document.body.removeChild(script) + }, []) + + return ( + <> +
+
+
+
+ + +
+
+
+
+
+ +
+
+
+ + ) +} + # RedwoodJS: The Tutorial Welcome to Redwood! If you haven't yet, check out the [Redwood README](https://github.com/redwoodjs/redwood/blob/main/README.md) to get a little background on why we created Redwood and the problems it's meant to solve. Redwood brings several existing technologies together for the first time into what we think is the future of database-backed single page applications. @@ -6,6 +72,12 @@ In this tutorial we're going to build a blog engine. In reality a blog is probab If you went through an earlier version of this tutorial you may remember it being split into parts 1 and 2. That was an artifact of the fact that most features demonstrated in part 2 didn't exist in the framework when part 1 was written. Once they were added we created part 2 to contain just those new features. Now that everything is integrated and working well we've moved each section into logically grouped chapters. +## Sign Up for Tutorial Reminders + +There's a new Javascript framework coming out every week, we know it can be hard to keep up. If you'd like some non-spammy emails reminding you to go through the tutorial, give us your email below: + + + ## Callouts You'll find some callouts throughout the text to draw your attention: From 9ce23fb3c2f8f6ea24cfc87907dfc318cbf29c9b Mon Sep 17 00:00:00 2001 From: Rob Cameron Date: Mon, 13 Jun 2022 14:12:32 -0700 Subject: [PATCH 8/8] Remove Mailchimp JS, move component to bottom to fix title --- docs/docs/tutorial/foreword.md | 105 +++++++----------- .../version-1.5/tutorial/foreword.md | 105 +++++++----------- 2 files changed, 78 insertions(+), 132 deletions(-) diff --git a/docs/docs/tutorial/foreword.md b/docs/docs/tutorial/foreword.md index 2b3509efcb99..de8c3b08505d 100644 --- a/docs/docs/tutorial/foreword.md +++ b/docs/docs/tutorial/foreword.md @@ -1,69 +1,3 @@ -import { useEffect } from 'react' - -export const MailchimpForm = () => { - useEffect(() => { - const script = document.createElement('script') - script.src = '//s3.amazonaws.com/downloads.mailchimp.com/js/mc-validate.js' - document.body.appendChild(script) - - return () => document.body.removeChild(script) - }, []) - - return ( - <> -
-
-
-
- - -
-
-
-
-
- -
-
-
- - ) -} - # RedwoodJS: The Tutorial Welcome to Redwood! If you haven't yet, check out the [Redwood README](https://github.com/redwoodjs/redwood/blob/main/README.md) to get a little background on why we created Redwood and the problems it's meant to solve. Redwood brings several existing technologies together for the first time into what we think is the future of database-backed single page applications. @@ -109,3 +43,42 @@ This tutorial assumes you are using version 1.0.0 or greater of RedwoodJS. ::: Let's get started! + +export const MailchimpForm = () => ( + <> +
+
+ +
+ + +
+
+
+ +) + diff --git a/docs/versioned_docs/version-1.5/tutorial/foreword.md b/docs/versioned_docs/version-1.5/tutorial/foreword.md index 2b3509efcb99..de8c3b08505d 100644 --- a/docs/versioned_docs/version-1.5/tutorial/foreword.md +++ b/docs/versioned_docs/version-1.5/tutorial/foreword.md @@ -1,69 +1,3 @@ -import { useEffect } from 'react' - -export const MailchimpForm = () => { - useEffect(() => { - const script = document.createElement('script') - script.src = '//s3.amazonaws.com/downloads.mailchimp.com/js/mc-validate.js' - document.body.appendChild(script) - - return () => document.body.removeChild(script) - }, []) - - return ( - <> -
-
-
-
- - -
-
-
-
-
- -
-
-
- - ) -} - # RedwoodJS: The Tutorial Welcome to Redwood! If you haven't yet, check out the [Redwood README](https://github.com/redwoodjs/redwood/blob/main/README.md) to get a little background on why we created Redwood and the problems it's meant to solve. Redwood brings several existing technologies together for the first time into what we think is the future of database-backed single page applications. @@ -109,3 +43,42 @@ This tutorial assumes you are using version 1.0.0 or greater of RedwoodJS. ::: Let's get started! + +export const MailchimpForm = () => ( + <> +
+
+ +
+ + +
+
+
+ +) +