Feedback Hub

screenshot of Feedback Hub
remix
vite
tailwind
daisyui
drizzle-orm

The app features JWT authentication and real-time updates using Server-Sent Events (SSE). It consists of four main pages: Home, Login, Register, and Create New Feedback. Users can share their thoughts and opinions through the app.

Overview

The Feedback Hub is an innovative project designed to streamline user feedback through a modern web architecture. It employs a Turborepo setup, allowing developers to efficiently manage multiple packages and applications within a single repository. With a focus on using the latest technologies and frameworks, this application provides a robust platform for users to engage, share, and access feedback seamlessly.

Building on the foundations of GraphQL and TypeScript, the Feedback Hub ensures a smooth experience for both developers and users alike. The frontend, crafted using Remix and styled with Tailwind CSS alongside DaisyUI, creates an aesthetically pleasing and highly functional interface. With features like JWT authentication and real-time updates, the Feedback Hub is well-suited for anyone looking to gather or provide feedback effortlessly.

Features

  • Turborepo Architecture: A monorepo structure simplifies the management of multiple packages and apps, increasing development efficiency.
  • GraphQL API: Built with Fastify and Mercurius, it offers powerful data retrieval and manipulation capabilities.
  • TypeScript Integration: Ensures static type checking, which enhances developer productivity and code correctness.
  • Remix Frontend: Utilizes a modern web framework that combines server-rendered HTML with client-side interactivity for a responsive user experience.
  • Tailwind CSS & DaisyUI: Provides a utility-first styling approach with pre-built components, ensuring a polished and easily customizable interface.
  • Fast Development Builds: Vite serves as a build tool, facilitating rapid development and production builds with minimal configuration.
  • Secure JWT Authentication: Employs JSON Web Tokens for secure user access and protected route management.
  • Real-time Updates with SSE: Automatically updates user feeds as new posts are created, enhancing user engagement without the need for manual refreshes.
remix
Remix

Remix is a modern JavaScript framework that focuses on building fast and performant web applications. It emphasizes a combination of server-rendered content and client-side interactivity, offering a robust architecture for creating scalable and maintainable projects.

vite
Vite

Vite is a build tool that aims to provide a faster and leaner development experience for modern web projects

tailwind
Tailwind

Tailwind CSS is a utility-first CSS framework that provides pre-defined classes for building responsive and customizable user interfaces.

daisyui
daisyUI

daisyUI adds classes to Tailwind CSS for all common UI components. Classes like btn, card, etc. This allows us to focus on important things instead of making basic elements for every project.

drizzle-orm
Drizzle ORM

Drizzle ORM is a TypeScript ORM for SQL databases designed with maximum type safety in mind. It comes with a drizzle-kit CLI companion for automatic SQL migrations generation. Drizzle ORM is meant to be a library, not a framework. It stays as an opt-in solution all the time at any levels.

eslint
Eslint

ESLint is a linter for JavaScript that analyzes code to detect and report on potential problems and errors, as well as enforce consistent code style and best practices, helping developers to write cleaner, more maintainable code.

graphql
Graphql

A website that uses GraphQL as a query language to manage data fetching and state management. This includes features such as a strongly typed schema, client-side caching, and declarative data fetching to streamline data management and optimize website performance.

turborepo
Turborepo

Turbo is an incremental bundler and build system optimized for JavaScript and TypeScript, written in Rust.

typescript
Typescript

TypeScript is a superset of JavaScript, providing optional static typing, classes, interfaces, and other features that help developers write more maintainable and scalable code. TypeScript's static typing system can catch errors at compile-time, making it easier to build and maintain large applications.

zod
Zod

Zod is a TypeScript-first schema declaration and validation library. It allows you to define schemas that can validate data at runtime while providing excellent TypeScript inference, making it perfect for API validation, form validation, and type-safe data handling.