Skip to content

Tommydreamer57/personal-project

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

83 Commits
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

Personal Project @ DevMountain


This is my very first full-stack, full-CRUD web application. I built it as a part of DevMountain's immersive web-development program.


Live at >>> http://personalproject.thomaslowry.me


Technologies Used:

  • React
  • Redux
  • SlateJS (https://docs.slatejs.org/)
  • Sass
  • NodeJS
  • Express
  • Passport-Auth0
  • PostgreSQL

  • Mobile Responsive

    The entire site is mobile responsive. See previews of the mobile site at the bottom of the README.


    SlateJS

    I used the SlateJS rich text editor library to allow admins to create dynamic blog posts.


    Landing

    Users may log in to save their favorites, or they may continue without logging in, just to view the site.


    Home Page

    All posts are visible organized into sections on the home page. Click on a section to view it individually. Click on a post to view the entire post.


    Post Page

    The post page displays the entire post. Users may click the blue heart button to add the post as a favorite. Admins may click the 'Edit Post' button to edit the post.

    Comment Box

    Users may comment directly on the post or respond to other users' comments.


    Navigation

    The navigation bar is hidden on the left and can be accessed through a smooth hover transition.


    Admin Page

    On the admin page, all posts are visible, including unpublished posts. Unpublished posts have a slightly darker background. Click the 'Create Post' button to go to the create page.


    Create Page

    An admin may select a section from all currently existing sections, or they may create a new section. They also input a subsection, title, and subtitle for their post.


    Edit Page

    On the edit page an admin may update the section, subsection, title, and subtitle of their post.

    Here they may also edit the body of their post. The text-editor is created by a library called SlateJS (https://docs.slatejs.org). My text editor in this app supports bold text (CTRL + B), italic text (CTRL + I), and code blocks (CTRL + ~).

    Click 'Save' to save changes to the post, and click 'Preview Post' to view the published post.


    Preview Page

    The preview page lets an admin know that a post has not been published yet.

    Click the 'Publish' button to publish the post. Click the 'Go to Editor' button to make further changes to the post before publishing.


    Mobile Site

    About

    No description, website, or topics provided.

    Resources

    Stars

    Watchers

    Forks

    Releases

    No releases published

    Packages

    No packages published