Welcome to this demo website!

I'm so glad you're here!

The purpose of this website is to showcase a variety of functionality. There are several things to explore:

  • Homepage - This is where you are at! This page (and all the others) are wrapped in a layout component to ensure the header and footer appear without having to import individually on every page.

    The data on this page is managed through the Contentful CMS (content management system). This allows the content to be changed without having to do a code push. It also allows for non-developers to easily manage content, as knowledge of HTML tags or coding is not needed. They can simply type what they need and click on the quick-formatting options within the Contentful text field for special things like bold or lists.

  • Header and Footer - These contain links to various internal pages and outside websites, as well as buttons for further user interaction. Give them a try!

  • Form Page - This is where you really get to interact with the website. Go ahead, enter some fun and silly test data to see how the different inputs behave! The form has two steps, so is easily scalable if a large, complex form is desired without overwhelming the user.

    Once you click submit, the data is saved to a Postgres database. Typically, forms like this are often hidden behind user login, and are saved with a user id attached. However, for this example the email entered into the form will serve as the key to fetch the data once the user logs in. This system allows anyone to test out the form, even if they don't feel like signing up for this demo. So make sure you remember whatever silly email address you entered into the form so that you can use it for the next step!

  • Sign up - Want to see your saved forms? Then it's time to sign up. When you click the 'Sign Up' button in the navbar, a modal will pop up to collect a few pieces of data. Make sure to enter the same test email address you entered into the form!

    Once you submit the form, you will be redirected to the hidden profile page. More on that later!

  • Login - Already signed up before and coming back to test more things? Then you can jump straight to login. Click the 'Log In' button in the navbar, enter the same data you did when you registered and submit, and then you will be redirected to the hidden profile page.
  • Profile Page - Only those who have registered get to see this page. It welcomes you with the email you entered. If you have submitted any forms, you will see them appear here for your review. If you are logged in, you will notice that a new button has appeared in the navbar, called 'Profile'. Click here when on any other page of the website to return to your profile page.
  • Log Out - You will see this button in the navbar while you are logged in. Click on it to log out and be redirected to the homepage. For the purpose of this demo website, you are automatically logged out when you navigate away from the website or refresh the page.

I hope you had fun exploring! Want to see the code and technologies that make this website run? Click here to view on GitHub, or click the GitHub icon in the footer.

Thank you for stopping by!