https://github.com/teekaytech/apple_clone
https://github.com/teekaytech/apple_clone
Last synced: 4 months ago
JSON representation
- Host: GitHub
- URL: https://github.com/teekaytech/apple_clone
- Owner: teekaytech
- Created: 2020-03-02T13:52:57.000Z (over 6 years ago)
- Default Branch: master
- Last Pushed: 2020-03-16T11:08:32.000Z (about 6 years ago)
- Last Synced: 2025-02-13T18:17:55.039Z (over 1 year ago)
- Language: JavaScript
- Size: 1.33 MB
- Stars: 4
- Watchers: 1
- Forks: 0
- Open Issues: 1
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# Apple Clone
This is a clone application of archived apple website.
In this project, my aim wasn’t to produce an exact replica of the archived apple.com page, but rather to focus on how to align all elements with float and flex or grid in CSS. That means two things – laying out the basic structure of the page using semantic HTML elements and ensuring that the elements are appropriately sized and positioned.
Some of the elements in the said archive are produced with Javascript but my objective in this project wasn't to give this page functionality, so nothing nothing else is clickable.
## Built with
* HTML
* CSS (Box Model, Grid, Flex and Float)
* Lint (Stickler)
* W3C Validator
## Live demo
https://teekaytech.github.io/apple_clone/
## Getting started
**I cloned an archived copy of Apple website. The main aim is to ensure the elements get placed and styled roughly the same way as the source, so functionality is not a priority.**
I used the browser’s developer tools to inspect the archived apple website to understand how elements are placed and styled.
I built my own page in a .html text file and opened it in our browser to check it out. I carried out the following steps:
- First setup a github repository for the project.
- Then create a .html file where all our HTML markup will go
- Create a .css file where all our styling code will reside
- Then open the archived web page at https://web.archive.org/web/20140301004610/http://www.apple.com/, inspect its features with browser's developer tools and start creating :shipit:
## Authors
:bust_in_silhouette: **Author:**
* Github: https://github.com/teekaytech/
* Twitter: https://twitter.com/ola_lere
* LinkedIn: https://www.linkedin.com/in/teekaytech/
## Contributing
Contributions, issues and feature requests are welcome!
1. Fork the Project
2. Create your Feature Branch (git checkout -b feature/AmazingFeature)
3. Commit your Changes (git commit -m 'Add some AmazingFeature')
4. Push to the Branch (git push origin feature/AmazingFeature)
5. Open a Pull Request
Feel free to check the [issues page](https://github.com/teekaytech/apple_clone/issues).
## Show your support
Give a :star: if you like this project!
## Acknowledgements
* [Microverse](https://www.microverse.org/)
* [The Odin Project](https://www.theodinproject.com/courses/html5-and-css3/lessons/embedding-images-and-video#introduction)
## License
Distributed under the MIT License.