# dwfaradji/freelance architecture

> Architecture diagram of the GitHub repository dwfaradji/freelance, generated by GitDiagram from its file tree, README and a sample of source files (last updated 2026-09-25). It is an AI-made overview: check details against the source.

- Interactive diagram: https://gitdiagram.com/dwfaradji/freelance
- Repository: https://github.com/dwfaradji/freelance

## Overview

DevEvoke is a freelance web-development portfolio and lead-generation site. Visitors explore the agency’s services, work, templates, pricing and editorial content, then can contact the developer or submit a multi-step project quote. The quote and contact email flows are visible in the sampled source; other page wiring is not, so those branches are shown as capabilities without inferred internal call chains.

Main entry points: [`src/components/navbar.tsx`](https://github.com/dwfaradji/freelance/blob/main/src/components/navbar.tsx) (Navigation), [`src/utils/callApi.ts`](https://github.com/dwfaradji/freelance/blob/main/src/utils/callApi.ts) (API client), [`src/components/SlideDevis/formDevis.tsx`](https://github.com/dwfaradji/freelance/blob/main/src/components/SlideDevis/formDevis.tsx) (Quote form), [`src/app/(pages)/services/page.tsx`](https://github.com/dwfaradji/freelance/blob/main/src/app/(pages)/services/page.tsx) (Services)

## Diagram (Mermaid)

```mermaid
flowchart TD

subgraph group_site["Site navigation"]
  node_home["Home page<br/>[page.tsx]"]
  node_navbar["Navigation<br/>[navbar.tsx]"]
end

subgraph group_content["Portfolio content"]
  node_about["About<br/>[page.tsx]"]
  node_services["Services<br/>[page.tsx]"]
  node_service_list["Service details<br/>[ServiceList.tsx]"]
  node_portfolio["Portfolio<br/>[page.tsx]"]
  node_templates["Templates<br/>[page.tsx]"]
  node_pricing["Pricing<br/>[page.tsx]"]
  node_blog["Blog<br/>[page.tsx]"]
  node_blog_data["Article content<br/>[dataBlog.ts]"]
end

subgraph group_leads["Lead generation"]
  node_quote_page["Quote pages<br/>[layout.tsx]"]
  node_quote_form["Quote form<br/>[formDevis.tsx]"]
  node_quote_api["Quote endpoint<br/>[route.ts]"]
  node_contact_page["Contact page<br/>[page.tsx]"]
  node_contact_form["Contact form<br/>[contact.tsx]"]
  node_contact_api["Contact endpoint<br/>[route.ts]"]
  node_newsletter["Newsletter form<br/>[newsLetters.tsx]"]
  node_newsletter_api["Newsletter endpoint<br/>[route.ts]"]
end

subgraph group_shared["Shared services"]
  node_quote_state["Quote state<br/>[reducer.ts]"]
  node_api_client["API client<br/>[callApi.ts]"]
  node_cookies["Cookie consent<br/>[index.ts]"]
end

node_visitor(("Visitor"))
node_mailer(("SMTP mail service"))
node_analytics(("Google Analytics"))

node_visitor -->|"visits"| node_home
node_visitor -->|"navigates"| node_navbar
node_navbar -->|"links to"| node_about
node_navbar -->|"links to"| node_services
node_navbar -->|"links to"| node_portfolio
node_navbar -->|"links to"| node_templates
node_navbar -->|"links to"| node_pricing
node_navbar -->|"links to"| node_blog
node_services -->|"renders"| node_service_list
node_blog -->|"reads articles"| node_blog_data
node_visitor -->|"opens quote"| node_quote_page
node_quote_form -->|"dispatches form"| node_quote_state
node_quote_form -->|"submits through"| node_api_client
node_api_client -->|"posts data"| node_quote_api
node_quote_api -->|"sends email"| node_mailer
node_visitor -->|"opens contact"| node_contact_page
node_contact_form -->|"submits through"| node_api_client
node_api_client -->|"posts data"| node_contact_api
node_contact_api -->|"sends email"| node_mailer
node_visitor -->|"subscribes"| node_newsletter
node_newsletter_api -->|"sends email"| node_mailer
node_visitor -->|"sets consent"| node_cookies
node_cookies -.->|"configures tracking"| node_analytics

click node_home "https://github.com/dwfaradji/freelance/blob/main/src/app/page.tsx"
click node_navbar "https://github.com/dwfaradji/freelance/blob/main/src/components/navbar.tsx"
click node_about "https://github.com/dwfaradji/freelance/blob/main/src/app/(pages)/a-propos/page.tsx"
click node_services "https://github.com/dwfaradji/freelance/blob/main/src/app/(pages)/services/page.tsx"
click node_service_list "https://github.com/dwfaradji/freelance/blob/main/src/components/Services/ServiceList.tsx"
click node_portfolio "https://github.com/dwfaradji/freelance/blob/main/src/app/(pages)/portfolio/page.tsx"
click node_templates "https://github.com/dwfaradji/freelance/blob/main/src/app/(pages)/templates/page.tsx"
click node_pricing "https://github.com/dwfaradji/freelance/blob/main/src/app/(pages)/tarifs/page.tsx"
click node_blog "https://github.com/dwfaradji/freelance/blob/main/src/app/(pages)/blog/page.tsx"
click node_blog_data "https://github.com/dwfaradji/freelance/blob/main/src/data/dataBlog.ts"
click node_quote_page "https://github.com/dwfaradji/freelance/blob/main/src/app/(pages)/devis/layout.tsx"
click node_quote_form "https://github.com/dwfaradji/freelance/blob/main/src/components/SlideDevis/formDevis.tsx"
click node_quote_state "https://github.com/dwfaradji/freelance/blob/main/src/context/reducer.ts"
click node_quote_api "https://github.com/dwfaradji/freelance/blob/main/src/app/api/devis/route.ts"
click node_contact_page "https://github.com/dwfaradji/freelance/blob/main/src/app/(pages)/contact/page.tsx"
click node_contact_form "https://github.com/dwfaradji/freelance/blob/main/src/components/Contact/contact.tsx"
click node_contact_api "https://github.com/dwfaradji/freelance/blob/main/src/app/api/contact/route.ts"
click node_newsletter "https://github.com/dwfaradji/freelance/blob/main/src/components/ui/Newsletters/newsLetters.tsx"
click node_newsletter_api "https://github.com/dwfaradji/freelance/blob/main/src/app/api/newsletters/route.ts"
click node_api_client "https://github.com/dwfaradji/freelance/blob/main/src/utils/callApi.ts"
click node_cookies "https://github.com/dwfaradji/freelance/blob/main/src/lib/cookie/index.ts"

classDef toneNeutral fill:#f8fafc,stroke:#334155,stroke-width:1.5px,color:#0f172a
classDef toneBlue fill:#dbeafe,stroke:#2563eb,stroke-width:1.5px,color:#172554
classDef toneAmber fill:#fef3c7,stroke:#d97706,stroke-width:1.5px,color:#78350f
classDef toneMint fill:#dcfce7,stroke:#16a34a,stroke-width:1.5px,color:#14532d
classDef toneRose fill:#ffe4e6,stroke:#e11d48,stroke-width:1.5px,color:#881337
classDef toneIndigo fill:#e0e7ff,stroke:#4f46e5,stroke-width:1.5px,color:#312e81
classDef toneTeal fill:#ccfbf1,stroke:#0f766e,stroke-width:1.5px,color:#134e4a
class node_home,node_navbar toneBlue
class node_about,node_services,node_service_list,node_portfolio,node_templates,node_pricing,node_blog,node_blog_data toneAmber
class node_quote_page,node_quote_form,node_quote_api,node_contact_page,node_contact_form,node_contact_api,node_newsletter,node_newsletter_api toneMint
class node_quote_state,node_api_client,node_cookies toneRose
class node_visitor,node_mailer,node_analytics toneIndigo
```

## Components

### Site navigation

- [Home page](https://github.com/dwfaradji/freelance/blob/main/src/app/page.tsx): `src/app/page.tsx`
- [Navigation](https://github.com/dwfaradji/freelance/blob/main/src/components/navbar.tsx): `src/components/navbar.tsx`

### Portfolio content

- [About](https://github.com/dwfaradji/freelance/blob/main/src/app/(pages)/a-propos/page.tsx): `src/app/(pages)/a-propos/page.tsx`
- [Services](https://github.com/dwfaradji/freelance/blob/main/src/app/(pages)/services/page.tsx): `src/app/(pages)/services/page.tsx`
- [Service details](https://github.com/dwfaradji/freelance/blob/main/src/components/Services/ServiceList.tsx): `src/components/Services/ServiceList.tsx`
- [Portfolio](https://github.com/dwfaradji/freelance/blob/main/src/app/(pages)/portfolio/page.tsx): `src/app/(pages)/portfolio/page.tsx`
- [Templates](https://github.com/dwfaradji/freelance/blob/main/src/app/(pages)/templates/page.tsx): `src/app/(pages)/templates/page.tsx`
- [Pricing](https://github.com/dwfaradji/freelance/blob/main/src/app/(pages)/tarifs/page.tsx): `src/app/(pages)/tarifs/page.tsx`
- [Blog](https://github.com/dwfaradji/freelance/blob/main/src/app/(pages)/blog/page.tsx): `src/app/(pages)/blog/page.tsx`
- [Article content](https://github.com/dwfaradji/freelance/blob/main/src/data/dataBlog.ts): `src/data/dataBlog.ts`

### Lead generation

- [Quote pages](https://github.com/dwfaradji/freelance/blob/main/src/app/(pages)/devis/layout.tsx): `src/app/(pages)/devis/layout.tsx`
- [Quote form](https://github.com/dwfaradji/freelance/blob/main/src/components/SlideDevis/formDevis.tsx): `src/components/SlideDevis/formDevis.tsx`
- [Quote endpoint](https://github.com/dwfaradji/freelance/blob/main/src/app/api/devis/route.ts): `src/app/api/devis/route.ts`
- [Contact page](https://github.com/dwfaradji/freelance/blob/main/src/app/(pages)/contact/page.tsx): `src/app/(pages)/contact/page.tsx`
- [Contact form](https://github.com/dwfaradji/freelance/blob/main/src/components/Contact/contact.tsx): `src/components/Contact/contact.tsx`
- [Contact endpoint](https://github.com/dwfaradji/freelance/blob/main/src/app/api/contact/route.ts): `src/app/api/contact/route.ts`
- [Newsletter form](https://github.com/dwfaradji/freelance/blob/main/src/components/ui/Newsletters/newsLetters.tsx): `src/components/ui/Newsletters/newsLetters.tsx`
- [Newsletter endpoint](https://github.com/dwfaradji/freelance/blob/main/src/app/api/newsletters/route.ts): `src/app/api/newsletters/route.ts`

### Shared services

- [Quote state](https://github.com/dwfaradji/freelance/blob/main/src/context/reducer.ts): `src/context/reducer.ts`
- [API client](https://github.com/dwfaradji/freelance/blob/main/src/utils/callApi.ts): `src/utils/callApi.ts`
- [Cookie consent](https://github.com/dwfaradji/freelance/blob/main/src/lib/cookie/index.ts): `src/lib/cookie/index.ts`

### Other components

- **Visitor**
- **SMTP mail service**
- **Google Analytics**

## Connections

- Visitor → Home page: visits
- Visitor → Navigation: navigates
- Navigation → About: links to
- Navigation → Services: links to
- Navigation → Portfolio: links to
- Navigation → Templates: links to
- Navigation → Pricing: links to
- Navigation → Blog: links to
- Services → Service details: renders
- Blog → Article content: reads articles
- Visitor → Quote pages: opens quote
- Quote form → Quote state: dispatches form
- Quote form → API client: submits through
- API client → Quote endpoint: posts data
- Quote endpoint → SMTP mail service: sends email
- Visitor → Contact page: opens contact
- Contact form → API client: submits through
- API client → Contact endpoint: posts data
- Contact endpoint → SMTP mail service: sends email
- Visitor → Newsletter form: subscribes
- Newsletter endpoint → SMTP mail service: sends email
- Visitor → Cookie consent: sets consent
- Cookie consent → Google Analytics: configures tracking
