0% found this document useful (0 votes)
3 views7 pages

Fullstack Developer Test

This document outlines a candidate skills assessment for a Full Stack Developer position at an advertising agency, consisting of frontend, backend, and practical tasks. It includes specific tasks such as building a Campaign Dashboard UI, an AI-Assisted Creative Brief Builder, and a Campaign Management REST API, along with evaluation criteria. The assessment is designed to test the candidate's ability to create modern web applications relevant to the agency's needs.

Uploaded by

areebafazil22
Copyright
© All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF, TXT or read online on Scribd
0% found this document useful (0 votes)
3 views7 pages

Fullstack Developer Test

This document outlines a candidate skills assessment for a Full Stack Developer position at an advertising agency, consisting of frontend, backend, and practical tasks. It includes specific tasks such as building a Campaign Dashboard UI, an AI-Assisted Creative Brief Builder, and a Campaign Management REST API, along with evaluation criteria. The assessment is designed to test the candidate's ability to create modern web applications relevant to the agency's needs.

Uploaded by

areebafazil22
Copyright
© All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF, TXT or read online on Scribd

ADVERTISING AGENCY

FULL STACK DEVELOPER

CANDIDATE SKILLS ASSESSMENT

Duration: 4 Hours Total Score: 100 pts Pass Mark: 70 pts

Candidate Name: Date:


_________________________ _________________________________
GitHub / Portfolio URL: __________________ Assessor: _____________________________

This assessment evaluates your ability to design and build modern full-stack web applications
relevant to an advertising agency's digital product needs. You will be tested on frontend, backend,
database, API integration, and AI tool usage.
SECTION 1 — Frontend Development
Build responsive, performant, and visually impressive interfaces that meet advertising industry
standards.

Task 1.1 — Campaign Dashboard UI (React + Tailwind)

BRIEF
Build a Campaign Performance Dashboard for an advertising agency. The dashboard displays
live campaign metrics for multiple clients. It must be built in React with clean, professional UI
design.

Required Components:
•​ Sidebar navigation: clients list, campaign list, settings
•​ KPI cards: Impressions, Clicks, CTR, Conversions, Spend, ROAS
•​ Line chart: 30-day performance trend (use Recharts or [Link])
•​ Campaign table: sortable, filterable, with status badges
•​ Date range picker with preset ranges (Last 7d, 30d, 90d, Custom)

Technical Requirements:
•​ React 18+ with hooks only — no class components
•​ Responsive: must work on 1440px, 1024px, and 768px breakpoints
•​ Dark mode toggle — persist preference in localStorage
•​ All mock data must come from a local JSON file — no hardcoded JSX data

// Expected mock data structure:{ "campaigns": [ { "id": "c001",


"name": "Lumiere Summer Launch", "client": "Lumiere Skincare", "status":
"active", "budget": 50000, "spend": 32450, "impressions": 2400000,
"clicks": 48000, "conversions": 1200 } ]}

Task 1.2 — AI-Assisted Creative Brief Builder

BRIEF
Build a multi-step form that allows account managers to fill in a campaign brief. On submission,
the brief is sent to an AI API (OpenAI or Anthropic) and returns a structured creative direction
document. Display the AI output in a formatted, print-ready layout.

Form must include:


•​ Step 1: Client details (name, industry, website, key competitors)
•​ Step 2: Campaign objective (awareness / consideration / conversion), target audience, budget
•​ Step 3: Creative preferences (tone, imagery style, color direction, do's and don'ts)
•​ Step 4: Review & submit — shows a summary before sending to AI
AI Output display must show:
•​ Campaign title suggestion, 3 headline options, tone of voice guide
•​ Recommended channels with budget allocation percentages
•​ Key visual direction (description of hero image concept)
•​ Export as PDF button (use jsPDF or html2canvas)
SECTION 2 — Backend Development
Build robust, secure, and scalable APIs that power agency digital products.

Task 2.1 — Campaign Management REST API

BRIEF
Build a RESTful API for managing advertising campaigns. This API will power the dashboard
from Task 1.1. The API must support full CRUD operations with proper validation, authentication,
and error handling.

Required Endpoints:
•​ GET /campaigns — list all, with filter/sort/pagination query params
•​ POST /campaigns — create new campaign (validate all fields)
•​ GET /campaigns/:id — single campaign with full metrics
•​ PUT /campaigns/:id — update campaign
•​ DELETE /campaigns/:id — soft delete only (add deleted_at timestamp)
•​ POST /auth/login — JWT authentication

Technical Requirements:
•​ [Link] (Express) or Python (FastAPI) — your choice
•​ Database: PostgreSQL (required) — provide schema SQL file
•​ JWT authentication — protect all campaign endpoints
•​ Input validation: reject invalid data with descriptive error messages
•​ Rate limiting: max 100 requests/minute per IP
•​ Provide a Postman collection or OpenAPI spec (YAML) for all endpoints

Task 2.2 — AI Content Generation Microservice

BRIEF
Build a standalone microservice that generates advertising copy using an LLM. This service will
be called by multiple internal tools. It must be well-structured, documented, and
production-ready.

Required Endpoints:
•​ POST /generate/copy — accepts {product, tone, platform, word_limit} returns {headline, body, cta}
•​ POST /generate/social — accepts {platform, campaign_goal, brand_voice} returns 5 caption
options
•​ POST /generate/hashtags — accepts {content, industry} returns 10 relevant hashtags
•​ GET /health — returns service status and model info

Technical Requirements:
•​ Docker-ready: include Dockerfile + [Link]
•​ Environment variables for API keys — never hardcoded
•​ Request/response logging with unique request IDs
•​ Streaming support for /generate/copy using SSE

Task 2.3 — Real-Time Notification System

BRIEF
Build a WebSocket-based notification system that alerts account managers when a campaign
metric crosses a threshold (e.g., CTR drops below 1%, budget spend exceeds 90%). Integrate
with the Campaign API from Task 2.1.

Deliverables required:
•​ WebSocket server ([Link] or native WS)
•​ Alert rule engine: configurable thresholds per campaign
•​ Simple React notification center UI: bell icon, dropdown, unread count badge
•​ Persist alert history in PostgreSQL
SECTION 3 — Speed & Practical Tasks
Timed technical challenges. Accuracy and code quality matter as much as speed.

# Task Stack Time Score /10


Q Debug a provided [Link] API: 4 bugs [Link] / Express / 20 min _____ / 10
1 causing incorrect responses and SQL SQL
injection vulnerabilities
Q Write a React custom hook: useDebounce React Hooks 10 min _____ / 10
2 that delays API calls in a search input by
300ms
Q Write a SQL query to find the top 5 PostgreSQL 15 min _____ / 10
3 campaigns by ROAS for each client in the
last 30 days
Q Optimize a slow React component: React Performance 15 min _____ / 10
4 identify and fix unnecessary re-renders
using React DevTools
Q Use GitHub Copilot or Cursor AI to AI Coding Tool 10 min _____ / 10
5 scaffold a new Express route with full
CRUD in under 10 minutes
EVALUATOR SCORING SHEET

Evaluation Criteria Max Points Score


1.1 Dashboard UI — Component Quality, Reusability, Responsive 15 ______
Design
1.1 Dashboard UI — Data Visualization & UX Quality 5 ______
1.2 AI Brief Builder — Multi-Step Form UX & Validation 10 ______
1.2 AI Brief Builder — AI Integration & PDF Export 5 ______
2.1 Campaign API — RESTful Design, Validation, Auth 10 ______
2.1 Campaign API — Database Schema Quality & SQL Skill 5 ______
2.2 AI Microservice — Code Architecture, Docker, Streaming 10 ______
2.3 Real-Time Notifications — WebSocket Implementation 10 ______
Section 3 — Speed Tasks (5 x 6 points each) 30 ______

TOTAL SCORE: _______ / 100 RECOMMENDATION: HIRE / HOLD /


REJECT

Evaluator Notes / Comments:

______________________________________________________________________________
______________________________________________________________________________
______________________________________________________________________________
______________________________________________________________________________

CONFIDENTIAL — FOR INTERNAL USE ONLY

You might also like