Picture
Profile Picture of Fiona Klacar

Fiona Klacar

Frontend Developer

Hi, I’m Fiona! As a passionate developer with a background in music and education, I bring a unique blend of creativity, collaboration, skills and perspectives to my programming work. During Technigo's intensive bootcamp, I honed my skills in Node.js, React, Redux, Javascript, CSS, and HTML, while also gaining valuable experience working with Agile methodology. My experience working in different countries has made me highly adaptable and flexible, which I believe is essential in the constantly evolving field of web development. Above all, I am committed to building intuitive user experiences with professional results.

Tech

HTML, CSS, JavaScript, ES6, JSX, React Hooks, Redux, Node.js, Mongo DB, Web Accessibility, API:s, mob-programming, pair-programming, Github.

Featured Projects

Picture of Samlas app

Samlas: an app for expats

This project involved the development of an interactive and secure online platform catering to expats in a new city. The platform allows users to register, log in, connect with others, and share events. To ensure security, authenticated RESTful APIs with access tokens were implemented. The frontend user interface was built using React Router for seamless page navigation, Redux for efficient data storage, and various NPM packages for additional functionality. This collaborative project involved independent branch work, pair-programming and a self-directed approach from start to finish.

JavaScript

React

Redux

Node.js

Express.js

Styled components

Picture of Labyrinth game

Labyrinth Game

An interactive, text-based Labyrinth game using APIs to retrieve a list of actions from the backend and present them as intractable items to the user. This project involved using thunks to wrap the API calls, redux to store the current state of the game and some fun Lotties to handle the response delay from the API fetches.

HTML

JavaScript

React

JSX

Redux

Styled components

Picture of to-do app

ToDo List

A to-do list built using Redux Toolkit. This project involved creating slices and reducers, and using selectors and dispatchers to interact with the store. Styled with Styled Components and an npm confetti package surprise.

HTML

CSS

JavaScript

React

JSX

Redux

Styled components

Picture-of-Space-quiz

Space Quiz

A space quiz built using Redux, using knowledge of global state and how to interact with a store using selectors or dispatching actions. Built through mob-programming with a team of four.

HTML

CSS

JavaScript

React

JSX

Redux

Picture-of-movies-app

Movies

A multi-page movies application built using React Router. This project involved combining useState with useEffect, using different API endpoints, and passing information such as product IDs to load dynamic content. Built through pair-programming as well as the use of branches in Github.

HTML

CSS

JavaScript

React

JSX

APIs

Picture-of-happy-thoughts-app

Happy Thoughts

A Twitter-inspired project with less negativity, Happy Thoughts uses knowledge of component lifecycles, how to use the useEffect hook in React to perform GET, POST and PATCH actions on my own APIs from the backend and how to put data into state.

HTML

CSS

JavaScript

React

APIs

Express

MongoDB

Picture-of-survey

Survey

A survey built utilising knowledge of React state, the useState hook, how to connect HTML form inputs to state and how to use state to show different components based on where one is in the survey.

HTML

CSS

JavaScript

React

Picture-of-music-app

Music Releases

A music project showing new album and single releases using React and data from Spotify. Built using boilerplate JavaScript, and using knowledge of node, npm, JSX and React components and props. Built through pair-programming.

HTML

CSS

JavaScript

React

JSX

APIs

Picture-of-weather-app

Weather app

A weather app that fetches live weather data from an API (OpenWeatherApp). This project utilised key concepts such as JSON, fetch() and promises to parse the data and manage the HTTP request and response. Built through mob and pair-programming, we worked with branches on GitHub and gained experience with merges and version control.

HTML

CSS

JavaScript

APIs

Picture-of-Guess-Who-game

Guess Who game

A digital take on the classic ‘Guess Who?' game, built using objects and arrays, array methods such as forEach() and filter() and knowledge of scope and how to manipulate the DOM using JavaScript.

HTML

CSS

JavaScript

Picture-of-Toddler-chatbot

Chatbot

A chatbot created using the fundamentals of JavaScript. Built using functions, variables, control flow and conditional statements/ternary operators.

HTML

CSS

JavaScript

Picture-of-news-site

News site

A project exploring the fundamentals of HTML, CSS and responsive design, with the goal of providing optimal user experience across different devices and screen sizes. Built using Flexbox and CSS Grid.

HTML

CSS

JavaScript

My words

A sign saying ‘You got this’ next to a laptop
April 2023
From Music to Code: Unexpected Parallels in a Career Changer's Journey

Once upon a time, I had no idea what programming or coding was. I used fun apps on my smart phone, but massively struggled to conceptualise ‘what’ code was or how it looked. It was a complete mystery to me! Like members of the generation before me that do not feel any instinct around a computer and are still a bit scared of pressing the ‘wrong’ button, I figured I’m the generation that has just missed out on what ‘coding’ is.

Skills

Code

  • HTML5
  • CSS
  • JavaScript ES6
  • React
  • Redux
  • Node.js
  • MongoDB
  • Styled components

Toolbox

  • Visual Studio Code
  • GitHub
  • Postman
  • Storybook
  • Figma
  • Figjam
  • Slack

More

  • Agile methodology
  • Pair/Mob-Programming
  • Stack Overflow
  • Code reviews

Upcoming

  • TypeScript
  • Next.js

Time to talk

Profile Picture of Fiona Klacar

Fiona Klacar

Frontend Developer

fiona.klacar@gmail.com

LinkedIn GitHub Contact