Movatterモバイル変換


[0]ホーム

URL:


Skip to content
DEV Community
Log in Create account

DEV Community

Cover image for My First Front-End-Only Project
Timotej Avsec
Timotej Avsec

Posted on

     

My First Front-End-Only Project

Hey guys!

Recently I decided to make a front-end-only application, since I felt that as a full-stack developer, I was lacking in my front-end skills.
So here is a little post on how I createdmoviez.io

Idea

I wanted to create something that would be challenging, but also useful. So after some time of thinking and brainstorming, I decided to go with movie-fetching app, which displays info about movies, TV series or actors.

Frameworks

For JavaScript framework I decided to go with VueJS, since it is the primary FE framework that we use in our company and would benefit me the most to improve on it.

I also went forBuefy Vue package, which is built on top ofBulma CSS framework.

Data source

Since the idea was to create only front-end, the app had to fetch data from external API. I decided to go withTMDB since it provides clean API interface.

CI/CD

For the convenience reasons I also implemented simple CI/CD using GitLab's CD/CD system.
It works in the following way: when I push changes to my development branch, project gets built and is deployed on staging AWS S3 bucket. When thedevelopment branch is merged intomaster branch, project is built and deployed to primary/production AWS S3 bucket. On production server there is also AWS CloudFront, that enables caching and overall better loading times.

TODO

There is still a lot of improvements to be done. Here are some of them:

  • Create and share list of your favourite movies / TV shows
  • Enable users to write review to movies and rate them (even tho it will require some back-end action 😊)
  • Improve overall page performance

Conclusion

In the end, I feel like I have learned a lot through this simple project. Even through this project is relatively simple, I tried to followVue good practises and front-end good practices overall.

So this is it from my part, if you have any opinions, well-intentioned criticism or just potential improvements, please do share them in the comments 🤗.

Top comments(3)

Subscribe
pic
Create template

Templates let you quickly answer FAQs or store snippets for re-use.

Dismiss
CollapseExpand
 
gillyrabuttsurwa profile image
Gilbert Rabut Tsurwa
Front-end developer, trilingual, investing most of my time in mastering Vue, along with learning other CSS and Javascript frameworks.
  • Location
    Duluth, Minnesota, USA
  • Joined

Fantastic application.

CollapseExpand
 
timotej_avsec profile image
Timotej Avsec
DevOps and Backend engineer from Slovenia
  • Location
    Slovenia
  • Work
    DevOps and Backend
  • Joined

Thank you very much! Glad you like it.

CollapseExpand
 
louislow profile image
Louis Low
UI / Web / Graphic Designer & Frontend Developer

Nicely crafted!

Are you sure you want to hide this comment? It will become hidden in your post, but will still be visible via the comment'spermalink.

For further actions, you may consider blocking this person and/orreporting abuse

DevOps and Backend engineer from Slovenia
  • Location
    Slovenia
  • Work
    DevOps and Backend
  • Joined

Trending onDEV CommunityHot

DEV Community

We're a place where coders share, stay up-to-date and grow their careers.

Log in Create account

[8]ページ先頭

©2009-2025 Movatter.jp