Weather Forecast

Weather Forecast is a React challenge project application. It connects to the US Census Geocoding API to get the latitude,longitude of an specific address and then connects to the US National Weather Service API to get the weather forecast for the following days.

It also implements a proxy server using NodeJs with Express and Axios to bridge the CORS issue that shows when querying the endpoints from the frontend.

Installation

Client

We're using ViteJs for project scaffolding:

npm create vite@latest

Using TailwindCSS for styling:

npm install -D tailwindcss postcss autoprefixer
npx tailwindcss init -p

tailwind.config.cjs

/** @type {import('tailwindcss').Config} */
module.exports = {
  content: [
    "./index.html",
    "./src/**/*.{js,ts,jsx,tsx}",
  ],
  theme: {
    extend: {},
  },
  plugins: [],
}

index.css

@tailwind base;
@tailwind components;
@tailwind utilities;

Server

We're using NodeJs with Express, Axios and CORS to run a proxy server to avoid CORS issues.

npm init
npm install express
npm install axios
npm install cors

Usage

Client

npm install
npm run dev

Server

node index.js

Example adddresses

• 520 South Fairmont Way, Orange, California
• 20 W 34th St., New York, NY 10001
• 3601 Lyon St, San Francisco, CA 94123
• 12601 State St, Atlanta, MI 49709
• 6929 Airport Blvd 110, Austin, TX 78752

SVG Weather icons

https://github.com/Makin-Things/weather-icons