This is a recruitment task project for ONX Center company.
Preview!
📖 Problem description
Twoim zadaniem jest stworzenie zaawansowanego panelu administracyjnego do
zarządzania treściami na stronie internetowej. Aplikacja powinna być oparta na frameworku
Laravel 10 (PHP) oraz Vue.js 3, a także działać jako pojedyncza strona aplikacji (SPA).
Celem tego zadania jest przetestowanie Twoich umiejętności programistycznych, zdolności
projektowych oraz umiejętności pracy z technologiami Laravel i Vue.js.
Wymagania:
• Stwórz stronę SPA, która będzie pełniła rolę zaawansowanego panelu administracyjnego.
• Wykorzystaj framework Laravel 10 do tworzenia API oraz obsługi logiki backendowej
aplikacji.
• Skorzystaj z Vue.js 3 do stworzenia interfejsu użytkownika, wykorzystując komponenty Vue
do tworzenia interaktywnych widoków.
• Aplikacja powinna umożliwiać zalogowanie się do panelu poprzez formularz logowania.
• Dane użytkowników oraz treści powinny być przechowywane w bazie danych SQL (wybierz
odpowiednią dla Ciebie technologię).
• Po zalogowaniu, użytkownik powinien mieć dostęp do następujących funkcji:
- Zarządzanie użytkownikami: Implementuj pełne CRUD dla użytkowników (imię, nazwisko,
e-mail, rola).
- Zarządzanie treściami: Stwórz CRUD dla wpisów (tytuł, treść, data publikacji) wraz z
możliwością przypisywania tagów.
Dodatkowe wyzwania:
• Implementuj paginację dla listy użytkowników i wpisów w interfejsie użytkownika.
• Zabezpiecz aplikację przed atakami typu SQL Injection oraz Cross-Site Scripting (XSS).
• Zaimplementuj autoryzację i autentykację w oparciu o wbudowane mechanizmy Laravel
oraz rolę użytkowników w dostępie do poszczególnych funkcji.
• Zaimplementuj wyszukiwanie użytkowników i wpisów w panelu administracyjnym.
• Dodaj możliwość sortowania i filtrowania wpisów na podstawie tagów.
• Stwórz mechanizm do przypisywania uprawnień użytkownikom na podstawie ich ról.
Zadanie z gwiazdką:
Czy jesteś w stanie zoptymalizować zapytania do bazy danych w celu maksymalizacji
wydajności aplikacji, szczególnie przy dużym obciążeniu?
Ocenianie:
Twoje rozwiązanie będzie oceniane pod kątem:
• Jakości kodu w oparciu o standardy Laravel.
• Skuteczności interfejsu użytkownika.
• Bezpieczeństwa i walidacji danych.
• Implementacji autoryzacji i autentykacji.
• Umiejętności pracy z PHP (Laravel) i Vue.js.
• Wydajności i responsywności aplikacji.
• Sposób na testowanie aplikacji (szczególną uwagę przywiązujemy do testów).
🛠️ Installation
-
First make sure u have installed latest versions of Laravel, Vue.js, XAMPP and Composer.
-
Clone this repository from admin-panel branch.
git clone -b admin-panel https://github.com/SzymCode/RecruitmentTasks.git
- Install modules in root directory.
npm install
composer update- Change .env.example file to .env in root directory, run XAMPP mysql server and create database.
mysql -u root -p
create database adminpanel- Migrate and seed database.
php artisan migrate:fresh --seed🚀 Run
- root directory:
npm run dev
php artisan serve❓ Factories & Tests
- Run factories to generate fake data.
php artisan tinker
User::factory()->count(100)->create();
Post::factory()->count(100)->create(); - Run backend tests.
php artisan test tests/Feature/PostsControllerTest.php
php artisan test tests/Feature/UsersControllerTest.php✅ Solved Problems
-
Single Page App
-
Responsive design
-
CRUD for users and posts
-
Search, filter and sort functionalities
-
Prevent SQL injection attack
-
Backend tests
-
Pagination
-
Live preview