A HackerNews clone built with Next.js and shadcn/ui

White — Tue, 02 Apr 2024 02:56:47 +0000

Introduction

Next.js Hackernews is an open-source hackernews clone written in TypeScript and built with Next.js and shadcn/ui.

Utilizes the latest Next.js features, including App Router, RSC, and Server Action.
With a stunning UI powered by shadcn/ui, it seamlessly adapts to both desktop and mobile environments, providing an exceptional user experience.
Data is retrieved from various sources, including the official API](https://github.com/HackerNews/API), official website, and HnAlgolia API.
Feel free to explore a live demo!

Next.js App Router
React Server Components (RSCs) and Suspense
Server Actions for mutations
Beautifully designed components from shadcn/ui
Styling with Tailwind CSS
Browse stories: Top, Newest, Best, Show, Ask, Jobs.
Search for stories.
User authentication: Create an account or log in using your Hacker News account to access personalized features.
Mark stories as favorite.
Upvote stories or comments.
Add comments.
View user profile: About, Submitted, Comments, Favorites, Upvoted(private).
Responsive design: Friendly to both mobile and desktop.
Automatic light/dark mode based on system settings.

Requires Node.js 18.17 or later.

git clone https://github.com/WhiteDG/nextjs-hackernews.git

cd nextjs-hackernews

pnpm install

cp .env.example .env.local

pnpm dev

pnpm run build

pnpm start