Posts

Job diary #2

Image
My intern journey continues :) It's now been 3 weeks and mostly I've spent my time independently learning Vue and Vuetify via my  Udemy course  and  this Youtube playlist  from Net Ninja ("Hi ganngg!"). Net Ninja tutorial and its dynamic dashboard generation especially helped me feel less afraid of the concepts I knew I needed to soon create for my own company. Granted, the content is slightly out of date since syntax changed in Vuetify v2, but there are comments helping out with the differences and I added my own too for any 2020 viewers. The more I learn about Vue the more I fall in love with it. Remember how painstaking it is to dynamically create content or lists with Vanilla JS? With Vue you can do it all with a simple v-for directive . It's going to be pretty hard not to "think in Vue" with future non-static projects of my own. Here is a quick example of how data generating and binding works in Vue. For practice I made a simple feedback so...

Job diary #1

Image
Today was the day! My first day as a web developer intern. Thing is, I still pinch myself over the fact this startup with the coolest guys gave me an opportunity to join the team and see how things go. Since many people asked for more details and gave such heartwarming encouragement in the web dev community, I'll try to do my best to document my journey :) My background No formal CS education nor even university degree  Previous work experience in fintech customer support with a touch of product management as a side project 100% self taught via online courses  Colt Steele's Bootcamps (CSS, Bootstrap, jQuery, Javascript, Nodejs) various Youtube tutorials on Javascript a few projects along with my portfolio https://anzudev.com What's the company like? It's a startup of 6 people, focusing on improving the microclimate of workplaces. Their webapp has a user-friendly and engaging twist on feedback surveys that employees get. Results are displayed in ...

Job offer and Vue

Image
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 be...

Technical task completion

Image
It's day 5 and therefore time to submit the technical task for the job application. Here is the final result. All in all, I can say I learned a lot here by practicing all kinds of loops and manipulating DOM. In plenty places, the code was not working, since the variables were referencing data, not extracting its value, so it was a good reminder how even a tiny syntax change can make a world of difference. let compareDataSet = []; compareDataSet . push ( tabledata [ tableIdx ]) //vs let compareDataSet = tabledata [ tableIdx ] It also showed me the upsides and downsides of using external libraries. They can certainly eliminate a lot of the grunt work (in this case creating functions for table data editing), but they can also make it very challenging to incorporate requirements on top of the initial purpose. Tabulator solved the problems of interactive tables and data management, but it also created a problem I could not solve within the timeframe: how to h...

Technical task continues!

Image
I've been elbow deep in a recently assigned technical task and I may see the light in the end of the tunnel here! I reached out to a friend (Per, if you're reading this:  ♡ ), and he was a really great teacher, guiding me how to achieve what I wanted without explicitly copy pasting me the solution. Here's what we achieved by the end of the day. See the Pen Tabulator project by Anzelika ( @anzuj ) on CodePen . UPSIDE: All the dictionaries now dynamically load upon page load, fetching the data from a nested array of all dictionaries! DOWNSIDE: Had to revamp the "add new pair" function I made for a single dictionary before, so that a form of 2 fields and a submit button would be generated for each and single dictionary within the loop. The above codepen solution works, but it is a bit lengthy, so I went back to the drawing board and tried out Tabulator's native "add row" method to reduce the amount of code. The results are pretty specta...

Job application's technical task

Image
 I got a response back from the place I applied to! Cheers and jump-up-and-downs quickly subsided though, after seeing the technical task they've set up for me. It's quite a pickle! Essentially, I need to build interactive dictionaries, AKA DOM manipulation on steroids. This means I have to brush off dust from my Javascript skills big-time, if I want to complete this task in 5 days. I am not yet so proficient in React, so I can only hope that doing it "old school" and styling it aesthetically pleasing would show how invested I am to make it work with the best way I know right now. For the sake of confidentiality, I modified the given data to animals/colors in the blog. Some source information was already given, so I decided to put the original data in an object array (eventually it would need to be an array of object arrays with other dictionaries too):  let tabledata = [{ animal : "hippo" , color : "grey" }, { ...

Defeating the fear of the terminal with React!

Image
Today is the day I did it! I opened the ever-feared terminal in my VS code. The final push was looking at React/Angular videos and seeing that following the project all required terminal commands. Since package management is elementary knowledge in this field, I decided I could no longer avoid getting comfortable with it. Aaand of course nothing went smoothly from the beginning. As soon as I tried to create a new file with touch index.html, this happened: Luckily my awesome Facebook coding community quickly came to rescue and pointed out that Window's native terminal "does not speak that lingo". So I had to switch to Git Bash terminal instead, which knows how to touch things. He. He. He. I dove into a React video next, but as if doomed, another problem showed within the first minutes. I was able to install react by: npx create-react-app, but when doing npm start, another error popped up *sigh* A bit discouraging to say the least, just wanting to learn a new ...