Hackernews

screenshot of Hackernews
solid
vite
unocss
planetscale
prisma

Hacker News clone made with SolidStart and tRPC

Overview

The Hacker News clone is an intriguing project that serves as a playful yet informative way to explore modern web development technologies. Built using SolidStart, UnoCSS, tRPC, Solid Auth, and Prisma, this application showcases the impressive capabilities of the SolidJS ecosystem while being hosted seamlessly on Vercel. It functions primarily as a learning tool, providing a hands-on experience with SolidStart and tRPC, making it a valuable resource for developers looking to enhance their skills.

This project beautifully combines contemporary web technologies, enabling functionality akin to established platforms like Hacker News. Its design and implementation invite users and developers alike to engage with a vibrant and active community, while simultaneously serving as a springboard for further exploration of the SolidJS framework.

Features

  • Authentication: Secure user login and registration system implemented with Solid Auth, ensuring user privacy and data protection.
  • Nested Comments: Engage in discussions with a feature that supports threaded comments, allowing for more structured conversations.
  • Upvote/Downvote: Users can express their opinions on posts and comments, promoting community interaction and content relevance.
  • Pagination: Smoothly navigate through content with an efficient pagination system to enhance user experience.
  • Optimize Queries: Backend optimizations to streamline data retrieval and improve loading times for a more responsive application.
  • Search: Easily find content with a built-in search feature designed to improve accessibility and user engagement.
  • Meta Tags: Improved SEO capabilities through the implementation of meta tags, increasing visibility and reach on the web.
  • Deploy on the Edge: Experience rapid loading times and lower latency with deployment strategies that leverage edge computing technologies.
solid
Solid

SolidJS is a declarative JavaScript library for building user interfaces, offering a reactive programming model for efficient updates. It stands out for its reactivity system that minimizes unnecessary re-renders and its small bundle size, making it a performant choice for developing lightweight and reactive web applications.

vite
Vite

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

unocss
UnoCSS

UnoCSS is an instant, on-demand atomic CSS engine that generates utility classes at build time. It's highly customizable, extremely fast, and compatible with Tailwind CSS utilities while offering additional features like attributify mode and pure CSS icons.

planetscale
Planetscale

PlanetScale is a MySQL-compatible serverless database that brings you scale, performance, and reliability — without sacrificing developer experience.

prisma
Prisma

Prisma is a server-side library that helps developers read and write data to the database in an intuitive, efficient and safe way.

fullstack
Fullstack

A fullstack boilerplate provides a starter application that includes both frontend and backend. It should include database, auth, payments, user roles and other backend services to build a fully featured saas or webapps.

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.

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.

vercel
Vercel

Vercel offers built-in support for deploying and hosting Next.js applications, making it a popular choice among Next.js developers.

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.