https://github.com/ozgebayram/tourplaces-sass

Tour Places Sass
https://github.com/ozgebayram/tourplaces-sass

javascript react reactjs sass sass-framework sass-mixins scss

Last synced: 17 days ago
JSON representation

Tour Places Sass

• Host: GitHub
• URL: https://github.com/ozgebayram/tourplaces-sass
• Owner: ozgebayram
• Created: 2023-02-04T14:16:16.000Z (almost 2 years ago)
• Default Branch: main
• Last Pushed: 2023-02-20T20:36:55.000Z (almost 2 years ago)
• Last Synced: 2024-12-19T00:41:12.624Z (17 days ago)
• Topics: javascript, react, reactjs, sass, sass-framework, sass-mixins, scss
• Language: JavaScript
• Homepage: https://ozgebayram.github.io/tourPlaces-sass/
• Size: 21.5 MB
• Stars: 0
• Watchers: 1
• Forks: 0
• Open Issues: 0
• Metadata Files:
  • Readme: README.md

Awesome Lists containing this project

README

        

# Project-Sass : Tour Places 

## Check The Live Website : https://ozgebayram.github.io/tourPlaces-sass/

## Description

Project aims to create a tour places app.

## Project Skeleton

```

----Tour Project(folder)

|

|----readme.md         # Given to the students (Definition of the project)

SOLUTION

├── public

│     └── index.html

├── src

│    ├── components

│    │       ├── cards

│    │       │     ├── Card.css

│    │       │     └── Card.js

│    │       ├── header

│    │       │     ├── Header.css

│    │       │     └── Header.js

│    │       └── navbar

│    │             ├── Navbar.css

│    │             └── Navbar.js

│    ├── helper

│    │       └── data.js

│    ├── App.js

│    ├── App.css

│    ├── index.js

│    └── index.css

├── package.json

└── yarn.lock

```

## Visualization of the Website

![Project 001 Snapshot](tour-project.gif)

## Objective

Build a Tour Project App using ReactJS.

### At the end of the project, following topics are to be covered;

- HTML

- CSS

- JS

- ReactJS

### At the end of the project, students will be able to;

- improve coding skills within HTML & CSS & JS & ReactJS.

- use git commands (push, pull, commit, add etc.) and Github as Version Control System.

## Steps to Solution

- Step 1: Create React App using `npx create-react-app tour-places`

- Step 2: Build tour places app using [`data.js`](./data.js).

- Step 4: Push your application into your own public repo on Github

- Step 5: Add project gif to your project and README.md file.