Job offer and Vue

Really exciting news - I got an offer of a position to work with an awesome startup! After getting a few rejections due to my lack of professional workplace experience and some frameworks, I was feeling a bit hopeless in regards to what learning curve I still have ahead to be employable, but then I got an unexpected callback by 3 lovely gentlemen who deemed me a good match for my illustration skills, willingness to learn and potentially my startup culture background helped too.

We agreed on a 80% mini "internship" for 2 months during which I'll try to wrack up my Vue skills and help make the webapp interactive and visually appealing.

It's scary. It's new! But I'll give my very damn best at my first job opportunity in the frontend field! Words can not accurately describe how grateful I am to them for taking this leap of faith in me :)

My tasks revolve around using Vue and Vuetify.js with their webapp. They've been in my bucketlist for ages, so what better time to learn!

STEP 1: Scrimba beginner course

I just recently discovered Scrimba learning platform, since a FreeCodeCamp React tutorial linked me there and I ended up buying React bootcamp. I really have to say - I love it! While Udemy gives a static experience (just a video you have to follow on your own part), Scrimba incorporates interactivity. You can move around the preview window, write code and see changes in "playground mode" whenever you want! It's a very refreshing touch on things. Resembles TeamTreeHouse courses, but their monthly subscription continues to be very offputting to someone who wants to learn things at their own pace.

Zaydek taught things with my most favourite subject matter (wizards!), but unfortunately it felt he jumped into generating content via Vue methods way too fast... I found myself stopping and rereading the code and struggling to understand how the result was achieved. As a beginner course, this does not seem very well thought through.

So I decided to hunt some more basic videos from Youtube to help me grasp the concept. Traversy Media always has quality content, so I decided in favor of this:

Vue UI seems seriously awesome compared to creating projects in terminal old-school style. Lots of stats on the project dashboard which I hope I'll know to use in the future.

I completed the To-Do app project, slowly understanding the mechanics of how Vue communicates with components, but sadly was not able to build the app for production either via Vue UI nor "npm run build" due to getting weird errors.

• Syntax used in the tutorial (unused res argument in the arrof function) actually was a problem when building for production
• Error "No module factory available for dependency type: CssDependency"
• Some people said that checking path casing in terminal vs windows file system is important. I noticed that in my VS code terminal the path is d/Anzu/etc, but in Vue compiler it's D:/Anzu/etc, so not sure if that can be the issue. According to Github comments newer versions of Vue already have a webpack taking care of any casing issues..

This is the frustrating part of web development: stumbling on obscure errors that do not happen in tutorials while you just try to focus on grasping the concept!


To better manage my learning time though, I'll put a pin in this for now and focus a bit on Vuetify. Hopefully the guys in the office may shed some light on most common reasons for build fails.