Front End Web Development Skills

The objective of this page is to give additional context relating to the skills I have within the domain of front-end development.
  • JavaScript
  • Front End Language

JavaScript is like my second language in web development. My Python is much better. In a similar way to a native English speaker trying to speak secondary school French, if I were to try to resolve a coding challenge in JavaScript, I would think of the code in Python first and then try to translate that into JavaScript.

Although syntactically different, I have developed a couple of toy projects in React which uses a syntax called JSX. React seems more expressive and intuitive to use than pure JavaScript, although ES6 syntax has improved JavaScript a lot in that regard. I enjoy programming in React and am looking forward to learn more of it.

I can often develop enough with JavaScript to write small scripts that supplement the use of my website. Again, there are a lot of examples of sprinklings of JavaScript throughout the portfolio that augment its functionality.

  • HTML5
  • Web Page Structuring

HTML is the front-end markup language that I have the most comfort with since I have been using it in some sense since the days of Microsoft FrontPage and Adobe DreamWeaver.

I can quickly write HTML due to VS Code's built-in Emmet support which enables markup to be written quickly using the many Emmet commands.

I have a good working knowledge of lists, tables, divs, paragraphs, formatting elements, blocks, images and links.

When used with classes and ids, I can usually style a website how I would like it to look, given the time to do so. I will be first to admit that this can often be the most frustrating side of building a website. If you've ever spent several hours researching and attempting to move an element a couple of pixels, then you'll know what I mean!

  • Sass
  • Web Page Styling

I can create a project's CSS using Sass. I personally use `node-sass` to compile my Sass into CSS. I find this works much more quickly than VS Code's Live Sass Compiler.

I can create variables and functions. I can separate the components of the project through partials and imports.

I know many CSS attributes, although it's still a relatively small proportion of those available.

My knowledge and skills in responsive design needs further work. Currently, it can take me a while to resolve responsive design issues between various devices and browsers. This is often a source of frustration for me in front-end development, although my gut feeling is that there is probably better tools out there to assist in making this development less painful.

  • Bootstrap
  • Styling and Components Framework

I am proficient with the use of most Bootstrap components. I have used many of these within the various projects in my portfolio.

From hours of fiddly practice, I can layout webpages quickly with grid layouts and fine-tune HTML elements with margins, padding, and spacing to achieve the desired look of a page.

Together with using Boostrap for visual design, I can use icon libraries such as FontAwesome in addition to using custom svg icons from websites like Iconify or WorldVectorLogo.

I would like to explore another CSS library, perhaps Tailwind CSS, in a future project. It is a challenging consideration though because I know I will have to sacrifice learned efficiency in Bootstrap to style a project using Tailwind.

Browse other skills...