A programming language needs proof. Documentation explains what a language can do. Examples show isolated features. But only a complete application demonstrates whether those features compose into something coherent -- whether the abstractions hold up when you build something real.
Session 272 produced that proof. In a single afternoon, we built the FLIN Showcase App: eleven pages, thirty-seven components, and demonstrations of email, image processing, PDF generation, background jobs, authentication, validation, and utility functions. The app was not a toy. It used real OAuth credentials, real SMTP configuration, real WhatsApp Cloud API integration. It was a production-capable application built entirely in FLIN.
This article documents what we built, how we built it, and what the showcase app reveals about the maturity of FLIN as a full-stack platform.
The Expression Evaluator: 80+ Functions in Templates
Before building the showcase app, we needed to expand what FLIN templates could do. The expression evaluator -- the runtime engine that processes {expressions} inside FLIN HTML templates -- needed access to the full breadth of FLIN's built-in functions.
We added over eighty functions to src/vm/renderer.rs in a single commit. The functions span six categories:
List operations: rest, slice, shift, unshift, insert_at, remove_at, flatten, zip, zip_map, concat, list_reverse, range, index_of, contains. These give templates the same list manipulation capabilities that JavaScript developers expect from Array methods.
Map operations: keys, values, entries, from_entries, has_key, get, set, delete_key, pick, omit, clone, merge. Complete map manipulation without leaving the template.
Set operations: union, intersection, difference, symmetric_difference. Mathematical set operations on lists.
Type operations: typeof, is_none, is_text, is_int, is_float, is_number, is_bool, is_list, is_map, is_entity, is_empty, to_bool, to_list, parse_int, parse_float, parse_date. Type checking and conversion.
Validation: Twenty-two validators available as functions -- is_email, is_url, is_uuid, is_phone, is_credit_card, is_iban, is_isbn, and more. These are the same validators used in entity decorators, now available in template expressions.
Security: bcrypt_hash, bcrypt_verify, hash, hmac, encrypt, decrypt, jwt_create, jwt_decode, jwt_verify, csrf_token, csrf_verify, generate_uuid, url_encode, url_decode. Full cryptographic and authentication primitives.
The result is that FLIN templates can do things that normally require backend logic:
// Validate directly in templates
{if is_email(user.email)}Valid email{/if}// Map operations in expressions {keys(myMap).count}
// List slicing for pagination {for item in slice(items, 0, 5)}
This is 1,561 lines added to the renderer in a single commit -- a testament to how the renderer's architecture was designed for extensibility from the beginning.
The App Structure
The showcase app lives in awesome-flin/flin-showcase/ and follows FLIN's file-based routing convention:
flin-showcase/
app/
index.flin # Dashboard -- feature overview
email.flin # Email functions demo
images.flin # Image processing demo
pdf.flin # PDF generation demo
jobs.flin # Background jobs demo
utils.flin # List/map/validation demo
auth.flin # JWT/TOTP/encryption demo
login.flin # Social login page
logout.flin # Logout handler
auth/
google/callback.flin # Google OAuth callback
github/callback.flin # GitHub OAuth callback
entities/
User.flin
Contact.flin
Document.flin
layouts/
default.flin # Main app layout
auth.flin # Login page layout
components/ # 37 Lucide icon components
i18n/
en.flin
flin.configEvery .flin file in app/ becomes a route automatically. app/email.flin serves /email. app/auth/google/callback.flin serves /auth/google/callback. No router configuration. No route registration. The file system is the router.
Page by Page
Dashboard (index.flin)
The dashboard page serves as the entry point, displaying feature cards with links to each demo page and live statistics. It demonstrates FLIN's ability to render dynamic content with entity queries directly in templates -- showing counts, recent records, and system status without any API calls or state management.
Email Demo (email.flin)
The email page demonstrates FLIN's built-in email functions: send_email for plain text, send_email_html for rich content, send_email_template for template-based emails, and email_validate_address for verification. The page includes interactive forms where the user enters recipient addresses and message content, then sends real emails through Postmark SMTP.
This is approximately three hundred lines of FLIN code. The equivalent in a Node.js application would require installing nodemailer, configuring SMTP transport, creating API endpoints, building React forms with state management, and writing error handling middleware. The FLIN version is a single file.
Image Processing (images.flin)
The image page demonstrates eight image functions: image_resize, image_crop, image_thumbnail, image_compress, image_convert, image_rotate, image_flip, and image_info. Users upload images and see the results of each transformation in real time.
PDF Generation (pdf.flin)
The PDF page demonstrates pdf_from_html, pdf_from_template, pdf_merge, and pdf_info. Users can generate PDFs from HTML content, merge multiple PDFs, and inspect PDF metadata.
Background Jobs (jobs.flin)
The jobs page demonstrates FLIN's job queue system: job_queue for adding tasks, job_status for checking progress, job_schedule for delayed execution, job_recurring for periodic tasks, job_cancel for stopping tasks, and job_retry for rerunning failed tasks.
Utilities (utils.flin)
The utilities page is the largest at approximately 350 lines, demonstrating list operations, map operations, type checking, validation functions, and JSON handling. It is structured as a series of interactive examples where users can input values and see the results of each function.
Authentication (auth.flin)
The authentication page demonstrates the security primitives: JWT creation and verification, TOTP secret generation and verification (for two-factor authentication), bcrypt hashing and verification, and symmetric encryption and decryption. Each function has an interactive demo.
Social Login: Real OAuth in FLIN
The login page is where the showcase app becomes genuinely impressive. It implements four authentication methods: Google OAuth, GitHub OAuth, WhatsApp OTP, and a sandbox mode for development.
// Google OAuth -- initiate login
result = auth_google_login(baseUrl)
session.auth_state = result.state
redirect(result.url)// Google OAuth -- handle callback user = auth_google_callback(query.code, query.state, session.auth_state) session.user = user
// GitHub OAuth -- initiate login result = auth_github_login(baseUrl) redirect(result.url)
// WhatsApp OTP -- send verification code result = whatsapp_send_otp("+22509757296") valid = whatsapp_verify_otp(phone, code)
// Sandbox -- instant login for development user = auth_flin_sandbox() ```
Each OAuth flow is a single function call. auth_google_login generates the authorization URL with PKCE state. auth_google_callback exchanges the code for tokens, fetches the user profile, and returns a user object. The entire OAuth dance -- which typically requires an OAuth library, session management middleware, environment variable handling, and multiple callback routes -- collapses to two function calls and a redirect.
The WhatsApp OTP integration connects to Meta's WhatsApp Cloud API to send verification codes via WhatsApp messages. For users in Africa, where WhatsApp is the primary communication platform, this is often more accessible than email-based verification.
The sandbox mode provides instant authentication for development, bypassing all external services. A developer can test their authenticated pages without configuring any OAuth credentials.
Layouts and Components
The showcase app uses FLIN's layout system for consistent page structure. The default.flin layout provides the navigation sidebar, header, and footer for all authenticated pages. The auth.flin layout provides a minimal wrapper for the login page.
The thirty-seven components in the components/ directory are Lucide icons -- each a self-contained FLIN component that renders an SVG icon. FLIN's component auto-discovery means these icons are available in any page without imports:
// No import needed -- FLIN auto-discovers components
<MailIcon />
<ImageIcon />
<FileTextIcon />What the Showcase Reveals
Building the showcase app in Session 272 validated several architectural decisions:
File-based routing works at scale. With eleven pages, nested routes for OAuth callbacks, layouts, and components, the file-based routing system handled complexity without configuration. Adding a new page meant creating a new file. The cognitive overhead was zero.
Template functions are sufficient for UI logic. The eighty-plus functions added to the expression evaluator meant that pages could implement complex logic entirely in templates. Validation, list manipulation, type checking, and formatting all happened inline, without requiring separate script sections or API calls.
Built-in functions replace entire libraries. The email page replaced nodemailer. The image page replaced sharp. The PDF page replaced puppeteer. The auth page replaced passport.js. The jobs page replaced bull or agenda. Each replacement was not just fewer lines of code -- it was fewer dependencies, fewer configuration files, fewer moving parts.
The single-file model scales. Each page in the showcase app is a single .flin file containing its data model, logic, and template. Pages range from 80 to 400 lines. At no point did the single-file model become unwieldy. The pages are readable, maintainable, and self-contained.
Running the Showcase
The showcase app runs with a single command:
cd awesome-flin/flin-showcase
flin dev .No npm install. No pip install. No Docker. No database setup. The FLIN runtime starts the development server, creates the database, serves the pages, and handles hot reload. The application is available at http://localhost:3000.
For production deployment, flin build produces a single binary that includes the runtime, the compiled application, and the embedded database. Deployment is copying one file to a server.
The Numbers
Session 272 produced sixty-five files and approximately three thousand lines of code in roughly two hours. The expression evaluator enhancement alone was 1,561 lines of Rust. The showcase app itself was approximately 1,500 lines of FLIN across eleven pages.
For context, a comparable application built with Next.js, Prisma, and React would require:
- A
package.jsonwith twenty-plus dependencies - A Prisma schema and migration files
- API route files for each endpoint
- React components with hooks and state management
- OAuth library configuration
- SMTP library configuration
- Image processing library configuration
- Job queue library and Redis configuration
- Environment variable validation
- Middleware for authentication
- Error boundary components
Conservative estimate: three thousand lines of TypeScript spread across fifty-plus files, plus configuration files, plus external services (Redis, PostgreSQL, SMTP relay). The FLIN version is self-contained.
The showcase app is not a marketing exercise. It is a proof that FLIN's abstractions compose correctly, that the built-in functions cover real use cases, and that a single developer can build a complete, production-capable application in an afternoon. The language works.
---
This is Part 193 of the "How We Built FLIN" series, documenting how a CEO in Abidjan and an AI CTO designed and built a programming language from scratch.
Series Navigation: - [192] Entity and Enum Patterns - [193] The FLIN Showcase App (you are here) - [194] Regex Support and Rest Parameters