- Creact UI for full stack application.
- Experience making a blog application, allowing me to render mark down.
- Have a blog where I can actually show my articles on my domain.
- Experience using Zustand.
- Make login, register, forgot password functionality.
- Practice with react.
THIS PROJECT IS MADE WITH NEXT ITS MADE WITH VITE + REACTJS
- MongoDB has docs for typescript which is helpful: Typescript Guide
- Zustand has guides for react ts: Typescript Guide
- React-Markdown has guide for rendering markdown -> html react-markdown docs
Example for creating and using state for articles / Auth functionality.
interface BearState {
bears: number
increase: (by: number) => void
}
const useBearStore = create<BearState>()((set) => ({
bears: 0,
increase: (by) => set((state) => ({ bears: state.bears + by })),
}))
- Capture state at your highest component on the DOM tree, so when you route away the store does not get re-initialized. I could be wrong about this but that's the fix i had for issue with state not being persistant. No, I did not want to use local or sesion storage at the time.
- Make the individual components { swiperComponent, articleasComponent, cardComponents }
- Add styling to the header component
- Make the side add portion of the blog
- Make sections on the main component to have the add section & articles section.
- Make the single article component & add edit for login.
- Add axios & pull data from public api.
- Add Zustand & pull data from the official blog api.
- Solidify the functionality for the blog login & registration.
- Find out why we cannot hold the login state in the store and have it on the entire app, updating state in wrong place in the DOM hierarchy
- Protect routes so use cannot access login without logging out.
- Add error messaging for API responses + ui actions.
- Add error handling.
- add markdown functionality.