Skip to content
/ your-react-blog Public template

A template for the blog assignment that is due at the end of the second sprint during the Array bootcamp. Students will have created a completely custom blog with JSX, React, Redux and React Router!

License

arrayinc/your-react-blog

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

2 Commits
 
 
 
 
 
 

Repository files navigation

Your React Blog (YRB)

By the conclusion of the second sprint of Array's bootcamp, you will create a blog that will allow users to see blog posts that you have created. This will include several different pages and give users an ideal experience to read topics that you want to discuss. The interface is entirely up to your choosing, but you will need to use the following technologies during the assignment. You will complete three different blog posts or more, three is the minimum. Each one will be done by a random person related to your blog's content and one blog post will be done by yourself.

For example, a blog about Array Inc would include "Professor Lindly", "Eric Trowbridge" and "Amy Surdam" as the authors of the three blog posts (each would have one blog post that they "wrote" in your blog website). They should all be included in the "about the authors" page as well.

Technologies Required

  • CSS
  • React
  • Redux
  • React Router
  • JSX (JavaScript XML)
  • Bootstrap

All Pages

  1. Should include a navigation bar with access to a list of blog posts, a "contact me" page, an "about the authors" page
    1. Should have some sort of indicator about what page you're currently on.
  2. Should include a footer of some sort with additional navigation links (same ones as navigation).
  3. Should have a "back to top" button that appears after scrolling past the first view height of the page.

Home/Index Page

  1. Should include a column with blocks for the "blog posts" that you've written.
    1. Include image of blog post.
    2. Include title of blog post.
    3. Include description of blog post.
  2. Should include an image carousel of some sort that will rotate around relevant images to your blog.

Blog Page

  1. Should include a full spot for the blog content.
  2. Should include a "cover image" for the blog.
  3. Should include a spot for the author's name and username and avatar.
  4. Should include a spot for the title of the blog post.
  5. Should include the date of when the blog post was finished.

About Me Page

  1. Should include a circular portrait of the various authors.
  2. Should have a spot for the author's information below the circular portrait.
  3. Should default to you as the first author shown.
  4. Upon clicking the author's circular portrait, it switches the information below the portrait to the information of the author.

Contact Page

  1. Should include a styled form with a nice background.
  2. Should be the basic form for contact forms.
  3. Should pop up a modal that says the message has been sent.

Ahead of the Game #1 (Bonus for Honors)

Improve the blog website by integrating commenting into the blog pages. This should be done in a spot at the bottom of the blog post pages, which has a spot for a name and a comment field. After submitting the comment, it appears in a "comments section" at the bottom of the blog post.

Ahead of the Game #2 (Bonus for Honors)

Further improve the website by allowing users to sign up for the website. After creating a username and password, it should be encrypted and then stored inside of their local storage or it can use web tokens and cookies. It should have a "remember me" checkbox that will keep the user signed in. Requires a sign-up additional page with a styled form as well.

About

A template for the blog assignment that is due at the end of the second sprint during the Array bootcamp. Students will have created a completely custom blog with JSX, React, Redux and React Router!

Resources

License

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published