An open API service indexing awesome lists of open source software.

https://github.com/xjectro/medusajs-restored-frontend

Like the mythical creature, this frontend has been reborn from the ashes... but instead of turning people to stone, it turns visitors into customers!
https://github.com/xjectro/medusajs-restored-frontend

app-router checkout ecommerce frontend headless-commerce jamstack medusajs nextjs nextjs-15 online-store payment-integration react responsive-design server-components shopping-cart static-generation storefront stripe tailwindcss typescript

Last synced: 10 months ago
JSON representation

Like the mythical creature, this frontend has been reborn from the ashes... but instead of turning people to stone, it turns visitors into customers!

Awesome Lists containing this project

README

          

# 🐍 Medusa.js Restored Frontend - The Phoenix of E-commerce!

*Like the mythical creature, this frontend has been reborn from the ashes... but instead of turning people to stone, it turns visitors into customers!*

## 🎭 What's This All About?

Welcome to the **Medusa.js Restored Frontend** - a sleek, modern e-commerce storefront that combines the power of Medusa's headless commerce backend with the blazing-fast Next.js 15! Think of it as the Swiss Army knife of online stores, but shinier and with better TypeScript support.

## ✨ Features That'll Make You Go "Whoa!"

### 🛍️ **Full E-commerce Arsenal**
- **Product Detail Pages** - Because first impressions matter (and so do the second, third, and fourth ones)
- **Product Overview Pages** - Where window shopping gets an upgrade
- **Product Collections** - Like Netflix categories, but for things you can actually touch
- **Shopping Cart** - The digital equivalent of "hold my beer"
- **Stripe Checkout** - Money talks, and we speak fluent credit card
- **User Accounts** - Your customers' digital home away from home
- **Order Details** - Receipts that don't fade in your pocket

### 🚀 **Next.js 15 Superpowers**
- **App Router** - Navigation so smooth, it's practically butter
- **Server Components** - Faster than your morning coffee kicks in
- **Server Actions** - Like regular actions, but with a cape
- **Streaming** - Not the Netflix kind, the "ridiculously fast loading" kind
- **Static Pre-Rendering** - Pages that load before you even click them (almost)

## 🎪 Quick Setup - The "I Want It Now" Edition

### Prerequisites (The Boring But Important Stuff)
- Node.js (the newer, the better - we don't judge vintage though)
- Yarn (because npm is so last Tuesday)
- A Medusa backend running on port 9000 (like a well-behaved server should)

### The Magic Spell (Installation)

1. **Summon your Medusa backend:**
```bash
npx create-medusa-app@latest
```
*This creates your backend faster than you can say "headless commerce"*

2. **Clone this beauty:**
```bash
git clone https://github.com/Xjectro/medusajs-restored-frontend
cd medusajs-restored-frontend
```

3. **Environment variables dance:**
```bash
mv .env.template .env.local
```
*Don't forget to fill in your actual values - lorem ipsum won't pay the bills*

4. **Install dependencies (the fun part):**
```bash
yarn install
```
*Time to grab a coffee while the internet downloads itself*

5. **Launch into orbit:**
```bash
yarn dev
```
*Your store is now live at [http://localhost:8000](http://localhost:8000) - prepare for takeoff! 🚀*

## 💳 Payment Integration - Show Me The Money!

### Stripe Setup (Because Everyone Loves Getting Paid)

Add this magical incantation to your `.env.local`:

```env
NEXT_PUBLIC_STRIPE_KEY=your-stripe-public-key-goes-here
```

*Remember: With great payment power comes great responsibility (and hopefully great revenue)*

## 🏗️ Tech Stack - The Dream Team

- **Next.js 15** - The React framework that makes developers happy
- **Medusa.js** - Headless commerce that doesn't lose its head
- **TypeScript** - JavaScript's smarter, more organized sibling
- **Tailwind CSS** - Making things pretty without the CSS headaches
- **Stripe** - Turning "I want this" into "Payment successful"

## 🎨 What Makes This Special?

This isn't just another e-commerce template - it's a **restored** frontend that brings together the best of modern web development:

- **Performance** - Loads faster than your customer's patience runs out
- **Scalability** - Grows with your business (and your ambitions)
- **Developer Experience** - Because happy developers make better products
- **Modern Architecture** - Built for 2024 and beyond, not 2004

## 🤝 Contributing

Found a bug? Have an idea? Want to make this even more awesome?

1. Fork it (the repo, not the road)
2. Create your feature branch (`git checkout -b feature/amazing-new-thing`)
3. Commit your changes (`git commit -m 'Add some amazing new thing'`)
4. Push to the branch (`git push origin feature/amazing-new-thing`)
5. Open a Pull Request and let's make magic happen!

## 📖 Documentation & Resources

- [Medusa.js Documentation](https://docs.medusajs.com) - Your best friend for backend mysteries
- [Next.js Documentation](https://nextjs.org/docs) - Everything you need to know about the frontend magic
- [Stripe Documentation](https://stripe.com/docs) - The money-handling manual

## 🎉 Final Words

Remember: E-commerce is not just about selling products - it's about creating experiences. This frontend helps you create experiences so smooth, your customers will think they're shopping in the future!

Now go forth and build something amazing! 🚀

---

*Made with ❤️, ☕, and probably too much TypeScript*

**P.S.** - If you make millions using this, we won't say no to a coffee donation! ☕💰