S&F Logistics Website

A modern, professional website for S&F Logistics built with React.

Features

• Responsive Design: Fully responsive layout that works on all devices
• Modern UI: Clean, professional design with smooth animations
• Shipment Tracking: Integrated tracking widget for real-time shipment status
• Quote Request: Comprehensive form for requesting shipping quotes
• Multiple Pages: Home, Services, About Us, Contact, and Get a Quote pages

Technology Stack

• React 18.2.0
• React Router DOM 6.20.0
• CSS3 with CSS Variables for theming

Installation

1. Install dependencies:

npm install

2. Start the development server:

npm start

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

Build for Production

npm run build

This creates an optimized production build in the build folder.

Project Structure

src/
  ├── components/      # Reusable components (Navbar, Footer, Hero, etc.)
  ├── pages/          # Page components (Home, Services, About, etc.)
  ├── App.js          # Main app component with routing
  ├── App.css         # Global app styles
  ├── index.js        # Entry point
  └── index.css       # Global styles

Color Palette

• Primary: #003366 (Deep Blue)
• Secondary: #FFFFFF (White)
• Accent: #FF6600 (Orange)
• Light Gray: #F0F0F0

Pages

• Home (/): Hero section, features, tracking widget, news section
• Services (/services): Detailed service offerings
• About Us (/about): Company mission, values, story, and certifications
• Contact (/contact): Contact form and company information
• Get a Quote (/quote): Comprehensive quote request form

License

© 2024 S&F Logistics. All rights reserved.