DEV Community

cychu42
cychu42

Posted on

A New Vue: A PR With Vue.js

What is it?

This is another contribution to Cuttle, which is a card game that utilize poker cards. The goal is to get to certain amount of points to win while disrupting your opponent.

They uses Vue.js, a framework for creating interface, which is rather new to me.

The PR

Image description
For this one, I was asked to wrap the re-connection page's text input fields(account and password) in a form element to comply with HTML convention. Also, I needed to add @submit.prevent="login" to stop unwanted submission of the form.

Process

Because this is a new framework for me, it took me some time to grasp how things work from looking at its website.
Some of the code used in the page I was supposed to edit remind me of Bootstrap, where you would see special named elements for rendering a page. As with most new tool, I start from looking at the getting started section of the site, which usually has some more beginner friendly information to help you understand the basic.
I tried to grasp some basic, and given that the PR isn't complex, I was able to have some understanding of the code structure to know how to place the form element. Using @submit.prevent="login" to stop unwanted submission reminds me of use of e.preventDefault() from React.js.

Learning

Depending on how much I work on the repo, I might get more into learning Vue.js. It's always interesting to learn something new, especially you didn't even know it existed. After learning several tools and language, I find I often instinctively compare them and lean on languages and tools I know to help me understand then new ones. "Oh, so This like A but X!"
As far as growth since Hacktoberfest, having been exposed to a new framework definitely counts as growth in my book.

AWS Q Developer image

Your AI Code Assistant

Automate your code reviews. Catch bugs before your coworkers. Fix security issues in your code. Built to handle large projects, Amazon Q Developer works alongside you from idea to production code.

Get started free in your IDE

Top comments (0)

Postmark Image

Speedy emails, satisfied customers

Are delayed transactional emails costing you user satisfaction? Postmark delivers your emails almost instantly, keeping your customers happy and connected.

Sign up

👋 Kindness is contagious

Please leave a ❤️ or a friendly comment on this post if you found it helpful!

Okay