https://github.com/pktcodes/backroads-react-project-v2

Backroads Project using React
https://github.com/pktcodes/backroads-react-project-v2

backroads create-react-app css ecmascript font-awesome html html-to-react javascript john-smilga react

Last synced: 10 days ago
JSON representation

Backroads Project using React

• Host: GitHub
• URL: https://github.com/pktcodes/backroads-react-project-v2
• Owner: pktcodes
• Created: 2023-06-14T04:57:03.000Z (over 1 year ago)
• Default Branch: master
• Last Pushed: 2023-06-21T05:45:34.000Z (over 1 year ago)
• Last Synced: 2024-11-08T23:58:24.863Z (2 months ago)
• Topics: backroads, create-react-app, css, ecmascript, font-awesome, html, html-to-react, javascript, john-smilga, react
• Language: CSS
• Homepage: https://react-backroads-v2-prod.netlify.app
• Size: 846 KB
• Stars: 1
• Watchers: 1
• Forks: 0
• Open Issues: 0
• Metadata Files:
  • Readme: README.md

Awesome Lists containing this project

README

        
# Backroads 🏖️

> PROD [Live] : https://react-backroads-v2-prod.netlify.app

#### Backroads Tours is a `HTML` to `React` project consisting of a straightforward user interface where there is a

- List of sections i.e. Navbar, Hero, About, Services, Featured, Footer.

- **Navbar** will have a **Logo**, links to navigate across the sections of the page, and *icons* to the social media managed by the company. 

   - On screens <992px, the Navbar will have *logo*, **NavButton**

- **Hero** will have headings, background image and an **`Explore Tours`** on click navigates to *Featured Tours* section. 

 - **About** will have an image and some information about the company along with **`Read More`**.

 - **Services** has articles with some information that tells about the benefits provided by the company for the tour.

 - **Featured** has been implemented in cards that show some of the featured tours.

 - **Footer** has links to navigate across the sections of the page, icons of social media operated by the company, and copyright information. 

- **Responsive design** has been implemented across all the sections of the page using *CSS Flexbox*, *CSS Grid* with columns layout.

- Icons are implemented using by **Font Awesome**, images from **Pexels**. 

- To run the project locally, clone the repo, `npm install` to install the dependencies, and `npm start` to start up the development server on default port 3000.

#### Languages

HTML, CSS, JavaScript, ECMAScript, React 

#### Deployment / Hosting

Netlify

---

_Note: I have developed this project ~ [1] as part of React 18 Tutorial and Projects Course (2023) taught by John Smilga._