/Kata-Tourism

Tourism site to demonstrate React

Primary LanguageJavaScript

Tourism Kata

Demo Site

Project Board

Example Review Process

Nice Commit Messages

Adobe XD Results Page

Project Wrap Up

API Documentation through Postman

Deploy History

React Walking Skeleton

Semantic UI Demo

Basic Home Page

Basic Login & Signup Page

Firebase Login

Installation

Yarn version: 1.17.3

Node version: v12.8.0

This project builds and deploys using Netlify.

Node

Node is a JavaScript runtime. Install Node here

Yarn

Yarn is a package manager for Node. You will need to install version 1.17.3 of yarn on your computer. Install Yarn Here

Project Brief

Develop a simple web app in React Javascript that shows local tours taking place in Melbourne. The overall design of the web app is for you to determine using the semantic ui found below.

The web app should have the following key pages:

  • Home/landing (don’t worry about the text/copy on this page it’s more about the layout of UI components and making it feel like a tourism related website)
  • Sign Up (email and password)
  • Search results (showing multiple tour search results including featured photo and tour title)
  • Detailed tour page (showing the relevant information pulled and displayed from the API)

Core functionality/objectives:

  • A user should be able to sign up
  • A user to be able to search and for the results to update
  • A user to be able to filter on price within search results

Run locally

yarn start

Runs the app in the development mode.
Open http://localhost:3000 to view it in the browser.

The page will reload if you make edits.
You will also see any lint errors in the console.

yarn build

Builds the app for production to the build folder.
It correctly bundles React in production mode and optimizes the build for the best performance.

The build is minified and the filenames include the hashes.
Your app is ready to be deployed!

See the section about deployment for more information.

Given More time

  • Consistent Styling across pages
  • Styled home page
  • Tour Page
  • Hide API Keys
  • Add Testing
  • Responsive Design