signup.md

The pitches have completed. You and your team have decided on the technologies and the tech lead has already begun hacking away. The Biz Dev approaches you and whispers two words, "User Acquisition". You can already feel the pressure...

Hey so like, we need to go out to the Night Market and start polling for opinions on our service. I already bought the domain and so I just need you to build the sign-up form so we can gather emails. Should be easy right? Cool. Oh, I need this done ASAP because I'm leaving for the market now. Thaaaaaanks :D

Goal

You have been tasked to build the landing page which will have a Sign Up Form. User's will visit the page, be asked to enter their first and last name, and email address. Then the User will be presented with a thank you message. You must use ExpressJS, implement some basic validations on the data coming in, and do this quick!

Requirements

Your Form will POST data to your '/signup' endpoint. No XHR will be used.

Form Validations

First Name

• Type: String
• Format: Alphabetic
• Required: Yes

Last Name

• Type: String
• Format: Alphabetic
• Required: Yes

Email

• Type: String
• Format: Valid Email Format (At least an @ sign)

Validation Failure

If the validations fail, render the index template but provide error messages. E.g. If email fails, display a message along the lines of "Please provide a valid email address". Also, if the email was incorrect but the First and Last name was correct, have your template auto-fill the First and Last name text values.

Server

Middleware

Provide validation middleware to the POST route.

'/signup' (required)

• Method: GET
• Template: signup

This route will render the signup template which has a form with 3 input fields for First Name, Last Name, and Email Address. The form will POST to the /signup route.

'/signup' (required)

• Method: POST

This is an endpoint for the sign-up form. On success it renders a template which will display the person's name that signed up and where the email was sent to as the message.

Thank you for signing up [First Name & Last Name], we will send you an email at [Email] to inform you of any updates!

'/' (optional)

• Method: GET
• Template: index

This will render the index template which has some placeholder text but a button which links to the '/signup' page.

References

Express Routes

Express Middleware

Express Templating

Jade Template Engine

It's like myApp but for sign-up pages