Ecosyste.ms: Awesome

An open API service indexing awesome lists of open source software.

Awesome Lists | Featured Topics | Projects

https://github.com/geekelo/losangeles-mountains-website

An SPA website built for mountain lovers to display the history of the losangeles mountains and mountain climbing schedules.
https://github.com/geekelo/losangeles-mountains-website

css-animations css-flexbox css-grid css3 htm5 javascript

Last synced: about 1 month ago
JSON representation

An SPA website built for mountain lovers to display the history of the losangeles mountains and mountain climbing schedules.

Awesome Lists containing this project

README 

        






 signature

  

  






# 📗 Table of Contents



- [📗 Table of Contents](#-table-of-contents)

- [📖 LMW Webpage ](#-lmw-webpage-)

  - [🛠 Built With ](#-built-with-)

    - [Tech Stack ](#tech-stack-)

    - [Key Features ](#key-features-)

  - [🚀 Live Demo ](#-live-demo-)

  - [💻 Getting Started ](#-getting-started-)

    - [Setup ](#setup-)

    - [Prerequisites ](#prerequisites-)

    - [Install ](#install-)

    - [Usage ](#usage-)

    - [Run Tests ](#run-tests-)

    - [Deployment ](#deployment-)

  - [👥 Authors ](#-authors-)

  - [🤝 Contributing ](#-contributing-)

  - [Future Features ](#future-features-)

  - [⭐️ Show your support ](#️-show-your-support-)

  - [🙏 Acknowledgments ](#-acknowledgments-)

  - [📝 License ](#-license-)



# 📖 LMW Webpage 



**LMW**  is an innovative and user-friendly web application designed to provide residents and visitors of Los Angeles with a comprehensive and interactive experience related to the stunning mountain ranges that surround the city. This application serves as a valuable resource for exploring, enjoying, and staying informed about the Los Angeles mountains. 

Head to the LIVE DEMO SECTIOON for Live links and presentations



## 🛠 Built With 



### Tech Stack 



  HTML

  



  CSS | BootStrap

  



JavaScript

  



### Key Features 



- **Mobile Friendly** : this website performs well on a mobile device like a phone or tablet.

- **Desktop Friendly**: this website is responsive to desktop screen sizes.

- **Simple and Attractive Design** : the UI / UX is engaging and appealing.

- **Functional** : this website is accessible, easy to navigate, and helpful for users.

- **Animations and transitions : This website has engaging transitions and animations that makes it easier to use, smoother and more natural.



(back to top)



## 🚀 Live Demo 



> View the live demo of this project by clicking the text below.



- [See Live Demo](https://geekelo.github.io/losangeles-mountains-website/index.html)



(back to top)



## 💻 Getting Started 



To get a local copy up and running, follow these steps.



> Clone the repository

```

git clone https://github.com/geekelo/losangeles-mountains-website.git

```

> And you are ready to begin your project



### Setup 

This project contains

An HTML FILE (free to edit) - file that contains html codes to give structure to the main webpage

A CSS FILE (free to edit) - file that contains css codes to style the webpage

A GIT IGNORE FILE (free to edit) - to hide personal or private files

HTML/CSS LINTER FILES (should not edit) - Do not make changes

A JAVASCRIPT FILE (free to edit) - that handles functionalities and dynamic HTML



### Prerequisites 

> You should have Node and Git Installed

> You should have basic knowledge on HTML / CSS / JavaScript

> You should have a code editor



### Install 



> Download install [VSCODE](https://code.visualstudio.com/) and [Git](https://git-scm.com/)

> To install linters, execute the following commands:

```

Initialize npm | ``` npminit -y ```

HTML | ``` npm install --save-dev [email protected] ```

CSS | ```npm install --save-dev [email protected] [email protected] [email protected] [email protected]  ```

```

### Usage 

To run the linters, execute the following command and fix linter errors:

```

HTML | ``` npx hint . ```

CSS | ```npx stylelint "**/*.{css,scss}" ```

If you get a flood of errors keep in mind that linters guide you in writing a clean code!

```

### Run Tests 

You can run this program on your browser



### Deployment 



You can deploy this project using the following procedure:



- Pick the right hosting provider.

- Choose the tool and method to upload your website.

- Upload files to your website.

- Move the website files to the main root folder.

- Import your database.

- Check if your website works worldwide.



(back to top)



## 👥 Authors 



(back to top)



👤 **Eloghene Otiede**



- GitHub: [@geekelo](https://github.com/geekelo)

- Twitter: [@Geekelo_xyz](https://twitter.com/Geekelo_xyz)

- LinkedIn: [LinkedIn](https://linkedin.com/in/eloghene-otiede)

- [See Documentation of Author's inputs](./Documentation/Geekelo-input.md)



(back to top)



## 🤝 Contributing 



You can offer Contributions, submit an [issue](../../issues/), and make a feature request.



## Future Features 



- Add pop up modals

- Add the contact form 

- Add more content pages



## ⭐️ Show your support 



> Please give a ⭐️ to support this project



(back to top)



## 🙏 Acknowledgments 



> I would like to thank COALITION TECHNOLOGIES for inspiring this project

> Original design idea by [COALITION TECHNOLOGIES.](https://www.figma.com/file/x5M29C6yMIMASOW9rQNDxt/Untitled?type=design&node-id=0%3A1&mode=design&t=HNnz5DrIZ1UvKtRd-1)



(back to top)



## 📝 License 



This project is [MIT](./MIT.md) licensed.



(back to top)