Co musisz znać, aby dostać pracę jako Junior Front-end Developer, przykładowe pytania rekrutacyjne

Wiele osób zaczynających swoją przygodę z frontendem zastanawia się, w którym momencie są gotowe, aby aplikować do swojej pierwszej pracy.

W ogłoszeniach często pojawiają się takie wymagania jak: "powinieneś dobrze znać HTML, CSS i JS", "znajomość jednego z frameworków (Angular/React/Vue)" albo "doświadczenie w programowaniu aplikacji internetowych".

Postaram się wyjaśnić na jakim poziomie te umiejętności będą od ciebie wymagane i co powinieneś wiedzieć zanim przystąpisz do pierwszej rekrutacji.

PIERWSZA PRACA W IT WYMAGA NAJWIĘKSZYCH PRZYGOTOWAŃ.

Możesz spotkać się z dużą konkurencją ze strony innych kandydatów, poświęć zatem dużo wysiłku i zaangażowania, aby być jak najlepiej przygotowanym.

O ile średnie wynagrodzenie programisty w Polsce jest dosyć wysokie to jako osoba bez komercyjnego doświadczenia nie powinieneś mieć zbyt wygórowanych oczekiwań. Branża IT jest na tyle specyficzna, że przez pierwszy rok lub dwa można podwoić wynagrodzenie. Na twoim etapie najważniejsza jest możliwość pracy z doświadczonymi ludźmi w ciekawym projekcie.

HTML

Na pierwszy rzut oka wydaje się najłatwiejszą do opanowania umiejętnością Front-end Developera, jednak posiada wiele możliwości nieznanych nawet doświadczonym programistom. Oprócz podstawowego zastosowania HTMLa powinieneś również znać jego wpływ na SEO oraz poprawną semantykę.

PRZYKŁADOWE PYTANIA REKRUTACYJNE

  1. Przepisz podany przykład kodu składający się z divów używając znanych ci tagów HTML5.
  2. Co powinna zawierać strona internetowa, aby była dobrze indeksowana przez wyszukiwarki oraz poprawnie wyświetlała się podczas udostępniania w mediach społecznościowych?
  3. W jaki sposób osadzać obrazy i ikony na stronie, aby były szybko wczytywane oraz miały jak najlepszą jakość?
  4. Wyjaśnij czym są atrybuty defer oraz async w tagu script oraz czym się różnią.

CSS

Junior Front-end Developer powinien znać większość podstawowych styli CSS oraz umieć zaimplementować często używane elementy UI takie jak modal lub wielopoziomowa nawigacja. Powinieneś potrafić zaimplementować animacje w CSS oraz biegle używać Flexboxa i CSS Grid. Obowiązkowa jest też znajomość responsywnego designu oraz dobrych praktyk związanych z implementowaniem widoków mobilnych.

Dobrym sposobem na przećwiczenie tych umiejętności jest znalezienie w Internecie gotowych designów stron, a następnie zaimplementowanie ich.

W rozbudowanych aplikacjach rzadko pracuje się na zwykłych plikach *.css. Dowiedz się czym są preprocesory CSS takie jak LESS czy SCSS, metodyka BEM lub podobne oraz CSS-in-JS.

PRZYKŁADOWE PYTANIA REKRUTACYJNE

  1. Wyjaśnij różnicę między box-sizing: content-box, a box-sizing: border-box.
  2. Animowania jakich atrybutów HTML powinieneś unikać i dlaczego?
  3. Popraw przykładowy kod CSS, tak aby korzystał z metodyki BEM oraz wykorzystywał SCSS.
  4. Wymień znane ci wartości dla display oraz omów różnice między nimi.

JS

JavaScript jest zdecydowanie najbardziej rozbudowanym obszarem z jakim musi się zmierzyć Front-end Developer. Podczas rozmowy możesz spodziewać się pytań z zakresu algorytmów, manipulacji DOMem, nowości wprowadzonych w ES6, a także wielu innych zagadnień. Nie sposób jednak omówić je wszystkie. Polecam zapoznać się z serią Functional Programming in Javascript z kanału Fun Fun Function na YT (a także z pozostałymi filmami) oraz darmowym kursem Javascript Algorithms And Data Structures na freecodecamp. Po zgłębieniu tych materiałów powinieneś być gotowy, aby odpowiedzieć na większość pytań rekrutacyjnych związanych z JavaScriptem.

PRZYKŁADOWE PYTANIA REKRUTACYJNE

  1. Wyjaśnij jakie wartości przyjmuje this w przypadku funkcji strzałkowej (arrow function) oraz zwykłej funkcji.
  2. Jaka jest różnica między var, let, a const?
  3. Zaimplementuj funkcję reverse, tak by była dostępna dla każdego Stringa (przykład użycia: "string".reverse() zwraca "gnirts").

Framework

Znajomość któregoś z popularniejszych frameworków może, ale nie musi być wymagana na rozmowie o pierwszą pracę. Będzie to zależało od profilu firmy oraz projektów jakimi się zajmuje. Warto jednak poznać podstawy jednego frameworka i potrafić tworzyć proste aplikacje.

Często przed samą rozmową możesz zostać poproszony o wykonanie prostego zadania, które sprawdzi twoje umiejętności wykorzystania frameworka. Najpopularniejsze problemy, które będziesz musiał rozwiązać to połączenie z API i wyświetlenie odpowiedzi, zarządzanie i wysyłanie formularza, zaimplementowanie prostych elementów UI takich jak modal, dropdown, taby, slider. Dobrze jest też znać podstawowe techniki testowania komponentów, aby móc krótko o nich opowiedzieć.

PRZYKŁADOWE PYTANIA REKRUTACYJNE

  1. Napisz aplikację, która pobiera listę filmów z API, pozwala na jej sortowanie oraz otworzenie szczegółów filmu na osobnej stronie (zadanie przed rozmową).
  2. Użyj store managera, aby zaimplementować licznik, którego wartość można zmniejszać lub zwiększać o 1 za pomocą przycisków, np. Redux lub Mobx w przypadku Reacta.
  3. Opowiedz o metodach debugowania aplikacji które wykorzystują framework Javascript.

Umiejętności miękkie

Nie samym programowaniem frontendowiec żyje. Praca przy budowaniu aplikacji to przede wszystkim praca w zespole. Podczas odpowiedzi na pytania rekrutera i rozwiązywania zadań zaprezentuj się jako osoba z którą łatwo się współpracuje i komunikuje.

Bądź szczerze zainteresowany i zaangażowany w rozmowę. Staraj się tłumaczyć i opowiadać o rozwiązaniach, które stosujesz. Masz dużo większe szanse przejść rekrutację, jeżeli zespół po prostu cię polubi i będzie chciał z tobą pracować.

Przed rozmową sprawdź wszystkie dostępne informacje na temat firmy, do której aplikujesz i staraj się je wykorzystać podczas rekrutacji.


Pamiętaj, że jako Junior Front-end Developer nie musisz posiadać komercyjnego doświadczenia w programowaniu. Oprócz znajomości powyższych zagadnień twoim najlepszym atutem będą hobbystyczne projekty, którymi możesz się pochwalić. W następnym blogpoście wymienię przykładowe projekty jakie możesz wykonać, aby poprawić umiejętności oraz zwiększyć szanse na dostanie pierwszej pracy.

Dołącz do Newslettera

A będziesz na bieżąco ze wszystkimi postami na moim blogu.