Technical Skills Portfolio

This site is a working demo built for the Senior Web Developer role at the Thich Nhat Hanh Foundation. Every feature listed below runs on this site — built with WordPress, LearnDash, custom PHP, JavaScript, and modern deployment practices.


Skills Demonstrated

Custom Theme Development

Block theme with Full Site Editing templates, theme.json design system (8 colors, 2 font families, 5 spacing sizes), and LearnDash template overrides (course.php, lesson.php, course_list_template.php).

Custom Plugin Development

Three custom Gutenberg blocks in a single plugin: Dharma Talk (static card with RichText), Practice Pause (interactive breathing exercise with vanilla JS), and Course Grid (dynamic ServerSideRender with PHP render callback).

PHP

LearnDash template overrides using learndash_get_course_steps(), learndash_is_lesson_complete(), and learndash_course_status(). Server-side block rendering with register_block_type() render callbacks. WordPress hooks and filters for template routing.

HTML & CSS

Block templates using WordPress design tokens (var(--wp--preset--color--forest-green)). Responsive grid layouts. Accessible markup with semantic HTML5 elements.

SASS

Each block has separate style.scss (frontend) and editor.scss (editor-only) files, compiled via @wordpress/scripts. BEM naming convention throughout.

JavaScript

Vanilla JS breathing exercise with timed state machine (Practice Pause view.js). React editor components using @wordpress/block-editor, InspectorControls, RangeControl, ToggleControl. Dynamic previews via @wordpress/server-side-render.

LearnDash

Demo course with 4 lessons seeded via WP-CLI. Custom course and lesson templates with progress tracking, breadcrumbs, and prev/next navigation. Dynamic Course Grid block querying sfwd-courses post type. Course-lesson relationships via learndash_update_setting().

BuddyPress

Installed with theme support declared. Community features planned for the next iteration.

Git & DevOps

Version-controlled WordPress workflow. Reproducible local setup via Docker Compose + WP-CLI. Production deployment on Railway with managed MySQL. One-directional content pipeline: make exportmake import-prodmake deploy.

Gutenberg

Three custom blocks (static, interactive, dynamic). Block patterns for reusable content layouts. Full Site Editing templates with wp:template-part. theme.json design system for consistent styling.


Architecture

Local development: Docker Compose with 4 services (WordPress, MariaDB, WP-CLI, Adminer). Theme and plugin bind-mounted for live editing.

Production: Railway with managed MySQL. WordPress container runs Apache as a single process (no supervisord). Uploads stored on a persistent volume. WordPress core and plugins baked into the Docker image at build time.

Content pipeline: Content is authored locally, exported via make export, pushed to production with make import-prod (direct MySQL connection to Railway), and deployed with make deploy (railway up –no-gitignore).


Links