Tweepia: Real-time Microblogging Platform

Welcome to Tweepia, a feature-rich microblogging platform developed using SolidJS, one of the fastest user interface libraries. This project highlights my expertise in creating responsive and efficient web applications with real-time capabilities.

Features

User Authentication: Implementing a secure user registration and login system with Firebase. Real-time microblogging: Users can post and comment on posts (Tweeps). Dynamic routing: A modular routing system using @solidjs/router. Responsive UI: Built with TailwindCSS, delivering an excellent user experience on all devices. Image Upload: Users can upload images with their posts. Profile Management: Users can manage their profile details. Serverless Backend: Backend logic is managed with Firebase Cloud Functions. Real-time updates: Changes are reflected in real-time, thanks to Firebase's real-time database features. Code Quality: Thoroughly typed with TypeScript to prevent bugs and improve developer experience. State Management: Effective state management strategy with solid-js store. Pagination: Implemented pagination logic to load data as user scrolls. Data persistence and revalidation: Added feature to retain user data and revalidate to ensure data integrity. Developed from scratch without the reliance on third-party libraries. Modular structure: Codebase is organized in a modular way, ensuring code maintainability and extensibility.

Tech Stack

Frontend: SolidJS, Tailwind CSS State Management: Solid-JS Store Routing: @solidjs/router Authentication & Database: Firebase Form Validation: Custom hooks Icons: solid-icons Build Tool: Vite

This project is an excellent demonstration of my abilities to create dynamic, user-friendly, and performance-driven web applications. I am open to opportunities where my skills can be put to the test to create more such impactful digital solutions.

Usage

Those templates dependencies are maintained via pnpm via pnpm up -Lri.

This is the reason you see a pnpm-lock.yaml. That being said, any package manager will work. This file can be safely be removed once you clone a template.

$ npm install # or pnpm install or yarn install

Learn more on the Solid Website and come chat with us on our Discord

Available Scripts

In the project directory, you can run:

npm run dev or npm start

Runs the app in the development mode.
Open http://localhost:3000 to view it in the browser.

The page will reload if you make edits.

npm run build

Builds the app for production to the dist folder.
It correctly bundles Solid in production mode and optimizes the build for the best performance.

The build is minified and the filenames include the hashes.
Your app is ready to be deployed!

Deployment

You can deploy the dist folder to any static host provider (netlify, surge, now, etc.)

Credits

Logo designed by @amirHiroon on Twitter.