MOSH - Responsive Hero App

What skills I use

• TypeScript

• Tailwind CSS

• React 18

• Next 13

Front-end Style Guide

Colors

• celadon: "#DAEED9"
• light-green: "#F9F9F2"
• dark-green: "#003d3b"
• coral-pink: "#FF6340"

Font

• ClearFace Std
• Maison Neue: 400 & 700 (Note: 600 font weight does not free to use. I use 700 instead so design looks different)

How to Start a project

First, install and run the development server:

# install node_modules
yarn 
# start server
yarn run dev

Start Server

http://localhost:3000 to view it in the browser.

Learn More

Connect to Mosh API

• Mosh API - Get Data from a list of consultation and therapy options

• Add Custom Font in Next13 - Loading @next/font for Next13 with TailwildCSS

• Fetch Data on Next13 - A new way to fetch data

Demo

You can see Mosh App