myFlix

MongoDB | Express | React | Node.js | Redux | JSX | SCSS | Parcel | JavaScript | Bootstrap

Check out the movie app! | GitHub | API

myFlix app screenshot

(please note myFlix takes a nap when not in use. If it takes longer than 30 seconds to load please try again.)

The Challenge

The myFlix web application was created for movie buffs! myFlix is a scalable web application that provides users with a place to login and browse a selection of movies. Users can add movies to a favorites list, remove movies from the list they don't like, link to director pages, with information about the directors of their favorite movies.

myFlix
myFlix Favorites menu

Tech Stack Explanation

I chose React due to the user interaction that this application was going to need to handle. Users were going to be clicking and changing views, inputs, and user data, so React was the obvious choice here. With the help of Parcel, Node.js, Express, and MongoDB, React was the most capable, while offering up a lot of freedom. The MERN stack offers a powerful method for setting up front-to-back end projects in a relatively short period of time. React's modular nature with its components make it easy to reuse components and features which saves time, and makes it highly scalable.

The Process

Creating the myFlix application was an enjoyable experience. User stories are converted into sketched wireframes, and are based on project assets provided. These wireframes act as a guide where coding concepts are visualized before being implemented. Visualizing a requirement of an application provides a better understanding of the process required to implement features. Wireframes also provide a great way to flesh out any desired user experience (UX) features and their functionality.

myFlix wireframes
myFlix mainView

Lessons Learned

I learned a lot about both backend and frontend programming while creating myFlix. I enjoy the structured nature of both SQL and NoSQL databases and really grew to appreciate the importance of good API documentation. Even when a project is using its own backend to feed the project it is always important to remember you won't be the last and only person to work on a project, so knowing what your endpoints do, and expect when they get requests was a vital lesson for this project.