Build
How this blog is built — Aulvem on Astro 5 and Content Collections
Aulvem runs on Astro 5 + MDX + Content Collections, with operational rules enforced by a Zod schema and rehype plugins. A map of the stack and the pieces that hold it together.
01 — Category
Build
Notes from the workbench.
Page 2 of 3
-
-
BuildFigma basics, part 3 — color, font, and shadow styles, then components and variants
Part 3 of the Figma basics series. Walks through registering and applying color, font, and effect (shadow) styles, then combining components with variants — the next step up in making a design file easier to maintain. Illustrated with example GIFs.
-
BuildHow to use Figma — basics, part 2
Figma basics, part 2. A walkthrough of strokes, grouping, components, and auto layout — the features that make UI parts genuinely reusable. With GIFs for each step. A foundation for a small design system.
-
BuildFigma basics, part 1 — frames, fills, text, and alignment
Figma basics, part 1. The first set of operations to learn in Figma: creating a frame, changing its background fill, moving and resizing elements, entering text, and aligning. Walked through with example GIFs, written for first-time Figma users.
-
BuildHow to use Figma — setup guide
A setup guide for getting started with Figma. Covers what Figma is, its core characteristics, account signup, team creation, opening a new design file, and the basics of the editor — step by step, with screenshots. A starting point for anyone new to UI design.
-
BuildDesign thinking, and how I actually use it at work
Design thinking is a problem-solving approach that borrows the designer's creative process and applies it to other fields. A walkthrough of the empathize / define / ideate / prototype / test flow, the Double Diamond model, and practical notes on using it day to day.
-
BuildVue.js basics — v-if and v-for
A primer on Vue.js template directives for conditional rendering and list rendering — v-if / v-else / v-else-if, v-show for visibility toggles, v-for with the :key attribute, and when to reach for v-if versus v-show.
-
BuildGetting started with Vue.js — v-bind basics, explained
A step-by-step intro to Vue.js's own HTML notation for newcomers: the mustache tag ({{ }}), the v-bind directive, its shorthand colon form (:), and binding multiple attributes at once — each with a runnable code example.
-
BuildVue.js for beginners — components, props, and two-way binding, explained with real code
A walkthrough of Vue.js components for first-time users — what a component is, how parent and child talk to each other, and where to use one-way binding (v-bind / v-on) versus two-way binding (v-bind + v-on, or .sync) — with runnable code at each step.
-
BuildVue.js basics — a working engineer's guide to the file structure and lifecycle
A working Vue.js engineer walks through the single-file component layout (template / script / style), the basics of data, methods, and the component lifecycle — when to use created vs mounted — with example code for people new to Vue.
-
BuildAngular vs Vue.js — what a year of using both in production actually felt like
A practical comparison of Angular and Vue.js from an engineer who used both on real projects for over a year — file structure, syntax, learning cost, and which one fits which kind of team.
-
BuildPublishing a blog with VuePress — the 2021 roadmap, and the parts still worth keeping in 2026
The full roadmap from when I shipped a blog on VuePress 1.x + GitHub + Netlify + Onamae.com in 2021. Four layers — local dev, repo, hosting, custom domain — sliced in a way that still maps onto today's Astro / Cloudflare Pages stack.