Skip to content

First project for the Udacity Full Stack Nanodegree. It dynamically generates the main web page using python scripts, css styles, javascript and HTML template. The main page displays information and plays trailer of the favorite movies of the author.

Notifications You must be signed in to change notification settings

abdullah-22/My-Favourite-Movies-Trailer-Website

Repository files navigation

Project # 01: Website - My Favourite Movies' Trailers

by Abdullah A. Salman

This project is built as an effort for the first project of Udacity Full Stack Web Developer Nanodegree Program .

I have built this project as python scripts, css styles, some jquery code and HTML templates which collectively generates an HTML webpage. The contents of the webpage include listing of my favourite movies, main information about them and it plays their trailer too. ~(˘▾˘~)

Wanna check ?

In order to run this project on your PC, you need to have python 3.x or later installed. (You can get it from here) Your web browser should also support HTML5, CSS3 and Jquery.

Well, most of the browsers already do that ;)

What to do now ?

  • Once you are sure to have the above mentioned requirements fulfilled, feel free to download the project as .zip file or clone it to your PC.
  • After syncing it to your PC or downloading and unzipping it, you can see the following directories and files hierarchy:
My-Favourite-Movies-Trailer-Website
├── _pycache_/
|   └── *.py  //some python files, ignore these 
| css/
│   └── main.css
├── imgages/
│   └── background_main.jpg
├── js/
│   └── main.js
├── templates/
│   └── body.html
│   └── header.html
│   └── movie_tile.html
|---
├── .gitattributes  //ignore both of these git files
├── .gitignore
├── entertainment_centre.py
├── fresh_tomatoes.html
├── fresh_tomatoes.py
├── media.py
├── movies.json
└── README.md
  • You can run the main program by double click on the "entertainment_centre.py file, or by running it from python shell or command prompt by following command:
python entertainment_center.py
  • andddd ... voila !!!
  • ヘ( ^o^)ノ\(^_^ )
  • Now, go on !!! experiment with it yourself ¯\(ツ)

Extras

Well, I have, potentially, tried to fulfill all the requirements of the project as discussed here and here. Since, it was super fun doing this project, I put little efforts to make my project work and look better. For this purpose I:

  • avoided hard-coding the data within the main code and used json instead - this can be useful in future, if the data is fetched through some API
  • separated html placeholders, css styles and jqeury code in different files and folders, for better understanding and change management
  • improved the look and feel of the resulting page by changing background, adding shadow effects, displayed more information of movies etc.

still open for suggestions and feedback ... let's make it better together :)

Ping me @

Abdullah A. Salman

Misc.

  • Some of the code used in this project was provided by Udacity (without any copyrights info).
  • All the media (including images, links, videos) used in this website may subject to copyrights of the respective owners.
  • These are used for educational purpose only and not for any commercial use.
  • This readme file is created by following the guidelines provided on Udacity Discussion Forum and using an online markdown editor.

About

First project for the Udacity Full Stack Nanodegree. It dynamically generates the main web page using python scripts, css styles, javascript and HTML template. The main page displays information and plays trailer of the favorite movies of the author.

Topics

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published