- HTML5
- Typescript
- React
- Sass
- Styled components
- Vite
- GitHub Pages
- Low-Fidelity Wireframe
- Arbetsformedlingens Design System
This project uses code standards by applying the ESLint and Prettier tools:
- ESLint: identifies bugs and patterns to make the code more consistent.
- Prettier: code formatter for making the code more readable and consistent.
This project is marked as "Finished".
To run the occupation search web application on you local machine, follow these steps:
- Download or clone the repository.
- Change directory to the code folder.
- Install the necessary dependencies by running
npm install. - To enable map add token for mapgl in env file, example env provided.
- Start the application using
npm run dev.
- https://jobsearch.api.jobtechdev.se/
- https://taxonomy.api.jobtechdev.se/v1/taxonomy/swagger-ui/index.html
- https://designsystem.arbetsformedlingen.se/
- https://www.jobtechdev.se/sv
- https://arbetsformedlingen.se/platsbanken/
- https://www.mapbox.com/
This project was an assignment in which we were tasked with creating an occupation search web application using external resources provided by Arbetsförmedlingen, the Swedish government's job search platform. By integrating their APIs, we implemented functionality to display relevant job ads, and by utilizing their design system, we ensured a cohesive and professional appearance. For styling, however, we applied our own custom colors as this was requested to give the application a unique look while maintaining the structure provided by Arbetsförmedlingen's design guidelines.
- Header: Header with navigation.
- Footer: Footer with navigation.
- Home: Homepage where user can search and navigate to searchpage either by including free search or leaving the input empty.
- Search Page: Here we display all ads and provide users with more options to refine their job search.
- Filters: User can filter by Occupations / Municipalities / Scope / Employment Type / Workplace / Qualifications / Language.
- Sorting: Functionality for sorting ads by Relevance / Application Date / Publication Date.
- Suggestions: Suggestions are displayed in a dropdown when user types in the searchbar.
- Map: Displays the geolocations of the ads in Sweden on a map with popups that can redirect users to the respective job page.
- Job page: Can view all information about the job in its own page.