yunhsiaho / modern-js-application

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

modern-js-application

Hsia & Josué modern js application

modern-js-application

Modern Js Application is a group project made by Josue and Hsia. It's a challenge asigned by BECODE LIEGE code training center. We had been working on this from 08/03/2021-11/03/2021 to learn about the teamworking pattern and consolidate our knowledges in the codes we've learned.

The mission

t's Monday morning. I sit at my desk, start the computer, and my two screens light up.

I open up my text editor and the terminal in the first screen. I type two simple words in the terminal: npm start and press ENTER. A few seconds later a browser tab launches in the second screen with a local server where I can see the application as I develop it.

I need to add a small new feature. I already have the code in my head, and start typing it out. Before I even save, a red squiggly line under a piece of recent code alerts me that there is a problem, and suggests a fix. I accept the fix, which is automatically applied to my code. Phew, that would have taken 30 minutes of my time to find and fix manually. And voilà, I'm good to go!

I keep typing, instantly solve two more problems, and hit Save. I'm not the best at keeping my code tidy and well indented, but my text editor is set to auto-format the code on save. Awesome, I don't even have to think about it and there I have my variables well aligned, my functions well indented, my nested conditionals well laid out. It's so much easier to read now.

I now see that I could organize my code a little better, and that I could add an additional explanation for future me in a comment. I save again.

I glance at my second screen. I haven't touched a thing since hitting Save, but the tab is automatically reloading with the new code applied. I watch the app load under my eyes, and I can immediately test it. Wow. That was a breeze, the new feature works!

I type npm build in the terminal and all my SASS and JS is bundled, optimized and minified, ready to ship to the browser with optimal performance. Development never felt better.

The languages used

  • JS
  • Parcel

Who make this master piece?

About


Languages

Language:SCSS 45.1%Language:HTML 32.7%Language:JavaScript 22.2%