Skip to content

Foam Patrol: a site created for surfers and people who want to get into the sport.

Notifications You must be signed in to change notification settings

AaronoKwok/foam-patrol2

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

Foam Patrol

Overview

Foam Patrol is a site I created to connect people who enjoy the sport of surfing or want to get into it. It hosts surf forecasts, surf trips, and paths to surf tutorials. 🤙

Live: Foam Patrol

main

Tech Used

React iconReact Router iconCSS3 iconhtml5 iconjs icon

Features

  • Retrieve weather and surf data from Stormglass.io API by using Axios
  • Use Javascrit's date object to display accurate time and weather information
  • Create responsive navbar with dropdowns
  • Use variety of weather icons to display accurate current weather conditions at surf spots
  • Use React Router to route through site's pages
  • Create a number of pages to practice design with JSX and CSS
  • Make app responsive
  • Figma wireframe view

Project Structure

/
 public/
 src/
    ├── assets/
    │   └── images/
    ├── components/
    ├── Context
    ├── hooks/
    ├── pages/
    └── utils/
 package.json

Running Locally

  1. Clone repo.
  2. Run npm install && npm start in terminal.

Preview

conditions

mainpage conditions

online courses

team

dynamic design

Inspiration

This site is inspired by websites like Barefoot Surf and Magic Seaweed.