This app was a code challenge to create a simple social network, where you can read, create , edit and delete posts. You don’t need an account, just enter a username and start creating posts.
See this running: https://posterizer.vercel.app/
You can check the app on your phone or set the browser to responsive mode on dev tools.
This project was created using the following technologies/libraries:
-
Next.js: Although the functionality of this app is on the client side, the page is using SSR (Server Side Rendering) through Next.JS
-
Typescript: A strongly typed programming language that builds on JavaScript, giving you better tooling at any scale. TypeScript code is more reliable and easier to refactor. This enables developers to evade errors and do rewrites much easier.
-
Styled Components: This library is a popular CSS in JS styling tool for react apps.
-
Redux/Toolkit: React Redux is the official React UI bindings layer for Redux. It lets your React components read data from a Redux store, and dispatch actions to the store to update state.
-
MUI: Material UI it’s a popular React UI framework. It provides a robust, customizable, and accessible library of foundational and advanced components, enabling you to build your design system and develop React applications faster.
-
Framer Motion: An open source production-ready motion library for React. It enables you to create good and complex animations, giving you total control over the status of the animations.
-
date-fns: Date-fns provides the most comprehensive, yet simple and consistent toolset for manipulating JavaScript dates.
-
Lodash: A modern JavaScript utility library delivering modularity, performance & extras. I’ve used to remove duplicate objects in an array with great speed.
-
Axios: Promise based HTTP client for the browser, to simplify http operations.
First, run the development server:
npm run dev
# or
yarn devOpen http://localhost:3000 with your browser to see the result.