Photo by Daniel Chicchon on Unsplash

Beginnings..

Karin Nordkvist
3 min readOct 20, 2020

--

As a task on the Front-End Developer Bootcamp I’m currently attending we were to create a blog, or some sort of diary to document our progress. I’ve been giving this a lot of thought, thinking that my reflections were too personal or simply too boring to publish. But then, as I was browsing the internet for solutions for my current project, it hit me: For every problem I stumble upon, someone made a piece of content that would help me.

As I consider myself a professional online lurker, and as one of the main rules of developing is ‘Do not repeat yourself’ (or others? 🧐) , I decided not to copy what others have written and publish it as my own thoughts, but rather share theirs instead. Like cherrypicking my favorite articles and solutions. 🍒

A second rule of developing that I’ve come across is KISS (‘Keep it simple, stupid’ or ‘Keep it stupid simple’), so why waste time and complicate things? Let’s get to it! ⚡️

The first weeks

Over the past 8 weeks we’ve been exploring regular HTML, CSS and Vanilla JavaScript. As this ‘blog’ has just now taken form, it would be a monstrous task to collect all the articles, smart tools and StackOverflow-threads I’ve read over the weeks. So to save myself some time (trust me, I need it. Sincerely /Lost in React-space), for now I’ll just give you my golden nuggets that helped me the most over the weeks. ✨

  1. Can I Use?
    To avoid ‘WTF Internet Explorer!’ and ‘WHY is it not <insert behaviour here>’. On CanIUse you search for the tags or functions that you’d like to use, and see if YouCanUse. (heh, see what I did there? 🤓) >>
  2. Superhi Tutorials
    Before getting admitted to the Technigo Bootcamp I was a regular at Superhi. Their not-too-pricy courses are truly GREAT, explained in a super easy way and they are also crazy generous with their free tutorials. From basic stuff like learning to work with Git and Github, CSS Grid and basic parallax to advanced stuff as creating your own AR-filter. >>
  3. Noun Project
    Looking for a favicon? Or a simple logo? Or just some weather-icons maybe? 🌤 Noun Project is packed with icons for all kinds of uses. I’ll be visiting Noun at least once per project. Guaranteed. >>
  4. CSS Gradient & Grabient
    Want your site to look modern and sleek in just one move? Add a gradient background. CSS Gradient lets you create your own (and throws the correct code at you) and Grabient has a few customizable ready-made ones to copy and paste into your code. >> & >>
  5. HTML Color Codes
    As the title says. Grab your hex-values (or RGB for rgba() here). >>
  6. Oh Shit, Git!?
    A classmate of mine, Lillemor Eriksson gave me this tip. Let’s just say I got into a bunch of arguments with Git and Command Line. You will too. 💀And here’s a way out. >>
  7. FreeCodeCamp.org & CodeCadamy on Youtube
    One of many good places to browse for knowledge. FreeCodeCamp have an excellent video on the basics of JavaScript, and CodeCadamy answers basically all questions you might have on code, such as ‘What is Front-End?’. >> & >>
Photo by Marija Zaric on Unsplash

I have a TON of more bookmarks, links, tools, videos and articles to share. This list above consist mostly of tools, I know, but as the weeks pass I’ll make sure to add some good StackOverflow threads, articles and specific youtube-videos to cover specific questions — as mentioned in the intro.

Be sure to follow along on my journey and mission to fill my head with code — maybe I’ll help fill up your’s too. It’ll be fun!

🌟

--

--

Karin Nordkvist

I'm a happy (and a bit nerdy 🤓 ) conceptual creator with roots in the Graphic Design Industry. I feel like this is just the beginning of something big ...