DEV Community: Tanya Mott

Ripple: One Blog Post, Every Social Platform, Written by Gemma in Your Browser

Tanya Mott — Sat, 17 Oct 2026 20:45:12 +0000

This is a submission for the Hacktoberfest Open-Source AI Challenge Week 2: Side Hustle

What I Built

This week I hit two years sober and relaunched my Substack. I wrote the post I'd been waiting two years to write, hit publish, and then realized I wasn't done. I still had to rewrite it as a Substack Note, an Instagram caption, a LinkedIn post and a short post. Each app wants a different length, a different tone, and a different place for the link.

So I built Ripple. You paste a blog post or newsletter, pick your tone, and get four ready-to-post drafts:

📝 Substack Note: 2–4 sentences that make people open the post
📸 Instagram caption: a scroll-stopping first line, emojis, "Link in bio," your sign-off and hashtags
💼 LinkedIn post: a hook, short lines, a question at the end, and the link ready to paste as the first comment
💬 X / Threads / Bluesky: one punchy line that fits in 280 characters, link included

The writing is done by Gemma, running entirely in your browser. Your unpublished post never leaves your device.

Who would pay for it: indie writers, newsletter creators and small business bloggers. Basically anyone who publishes and then dreads the "now share it everywhere" part. There's no server and no API bill, so it can stay cheap: a small monthly subscription, a few dollars, instead of the pricey social media tools.

Demo

Live app: https://ripple-nxxz.onrender.com/
(Chrome or Edge on a laptop works best. Click "Try a sample" if you don't have a post handy.)

Code

tmott13 / ripple

One post, every platform. Turns a blog post into a Substack Note, Instagram caption, LinkedIn post and short post, with Gemma running privately in your browser.

✨ Ripple

One post. Every platform. Written privately in your browser.

Paste a blog post or newsletter and get a Substack Note, an Instagram caption, a LinkedIn post and a short post for X, Threads or Bluesky. The drafts are written by Gemma running in your browser with WebLLM, so your unpublished writing never leaves your device.

Built for the DEV Hacktoberfest Open-Source AI Challenge, Week 2: Side Hustle.

Who it's for

Indie writers, newsletter creators and small business bloggers who publish a post and then spend another hour rewriting it for every app.

How it works

Gemma does the writing. Each platform gets its own short, focused prompt, because small models do best with one clear job.
The app owns the facts. Gemma never writes links, hashtags or sign-offs. The app adds the link where each platform wants it ("Link in bio" on Instagram, a ready-to-copy first comment…

View on GitHub

How I Built It

Open model: Gemma 2 2B (gemma-2-2b-it-q4f16_1-MLC) on laptops, with Gemma 3 1B as the lighter option and the only one that fits on an iPhone.
Runs in the browser: WebLLM runs Gemma on the device's GPU with WebGPU. The model downloads once and is cached, so after that it even works offline.
Frontend: Angular 22 with signals. Drafts stream in word by word, and everything you type is saved in your browser only.
Hosting: a free static site on Render. There's no backend at all.

The most important design decision came from my last project. In Off-Grid Trails, I learned that a small model is great with words and shaky with facts. So in Ripple, Gemma writes the words and the app owns the facts:

Links: Gemma is told not to write links, and the app strips any it sneaks in. Then the app puts your link exactly where each platform wants it.
Hashtags: Gemma suggests topics, and the app turns them into clean hashtags and caps them per platform.
Limits: the app enforces each platform's character limit and cuts at a full sentence, never mid-word. On X, it saves 23 characters for your link.
Made-up numbers: if a draft includes a number that isn't anywhere in your post, the app flags it with a ⚠️ so you can check it before posting. Small models love to invent stats.
Cleanup: "Sure! Here's your caption:" preambles, quote marks and repeated sentences get stripped automatically.

Each platform also gets its own short prompt instead of one giant one. A 2B model does much better with one clear job at a time.

I was surprised by how well Gemma generated the text for the post using the correct tone for each.

I built this with Claude as my pair programmer. I picked the problem from my own week, made the product calls, and tested it on my own posts.

Why Open Innovation Matters

Your drafts stay private. Unpublished writing is personal. Mine was about my sobriety. With an open model running locally, nothing is uploaded to anyone's server.
It costs nothing to run. There's no per-request API bill, so a side hustle like this can stay cheap for creators.
It works offline. Once Gemma is downloaded, you can write your captions on a plane.
I control the whole pipeline. I can shrink the model's memory, rewrite the prompts, and add my own safety checks around it. A closed API would be a black box in the middle.

My First User

I was my first user for Ripple. I took my most recent post on my Substack and pasted it in along with the title and URL to the post. I chose "warm" for the tone and my name as the sign-off. I kept all four platforms selected.

Gemma was able to generate four wonderful captions with the correct tone for each platform along with helpful hashtags. I even like the emojis it included in each response.

I like that I can regenerate the text if I don't particularly like or agree with the response.

I don't think I would change anything currently. It works as expected and does an excellent job. I'm so glad I had this idea and to be able to bring it to life! This is definitely a tool I can see myself using and expanding on in the future for my own blogging.

I would pay a small subscription fee per month to use it. I think it is worth it, especially if you write often.

One thing I would add for the future of the app is the ability for Ripple to scrape the article text from the URL so you don't have to paste in the entire article. I probably would also add more social platforms like Facebook, Medium, and Wordpress.

Prize Categories

Gemma: Gemma 2 2B and Gemma 3 1B run fully in the browser with WebLLM, and the app is built around keeping their output trustworthy.
Render: the app is deployed as a free Render static site from a render.yaml blueprint.

Thanks to DEV, the Hacktoberfest team, and the MLC/WebLLM and Gemma teams for making on-device AI this easy to try. ✨

My Global Hack Week Recap: Cursor, Grok and a Few Tiny Apps

Tanya Mott — Fri, 16 Oct 2026 01:18:07 +0000

Last week I took part in MLH's Global Hack Week as part of Hacktoberfest 2026. I had one week, a healing ankle, and a goal of finishing my Hacktoberfest sticker book. I came out of it with a handful of small projects, 14 GHW points, and I'm now a Hacktoberfest Completionist (16 stickers). 🎉

Here's what I built, what I tried, and what I learned.

Challenge 1: Game Day Glance (built with Cursor)

Live app: https://game-day-glance.onrender.com

I'm a huge Atlanta sports fan, so my first build was Game Day Glance: It shows when my favorite Atlanta sports teams play next. It also shows the live games at the top so I can keep an eye on all the action taking place in one place.

I built it with Cursor using Grok. I was surprised by how well it looked on the first run. I only had to make one tweak to show the live games at the top. The colors and layout were on point from the start. My only thing is that it took awhile to generate the app. I do love the refresh button, it is very handy.

Challenge 2: Benchmarking Cursor's models

Next, I gave the same task to three models in Cursor: Grok 4.7, Claude Opus 5.5 and Gemini Flash 3.8.

Prompt (same for all three models):

“Write a JavaScript function formatCountdown(gameDate) that returns a friendly string like ‘Live now’, ‘Tonight 7:30 PM’, ‘Tomorrow 8:20 PM’, ‘in 3 days’, or ‘Sat, Oct 17 · 3:30 PM’ in Eastern time. Include a few test cases.”

I picked this because it’s a real function from my Game Day Glance app, a GHW mini app I built with Cursor that shows the next game for every Atlanta team.

Model 1: Grok 4.7

Pros: very thorough, and the result worked well.
Cons: by far the slowest of the three.

Model 2: Claude Opus 5.5

Pros: fast, and the result worked well.
Cons: none I noticed for this task.

Model 3: Gemini Flash 3.8

Pros: speed was in between the other two. It wrote the most test cases of the three, and it included code snippets right in its answer along with the files, which made it easy to review without opening anything.
Cons: none I noticed for this task.

Takeaway: all three produced a working function, so the real differences were speed, test coverage, and how they presented the answer. For quick, everyday tasks, I’d pick the fastest model that still gets it right. When I want extra confidence, Gemini’s extra tests were a nice bonus, and I’d save the slower, more thorough model for bigger problems.

Challenges 3, 4 and 6: Building my own Grok Bot

I created my first Grok Bot and named it, fittingly, Grok. Then I taught it two skills:

ESPN next-game skill (Challenge 4): Grok looks up when my teams play next, and a routine runs every Friday at 5 PM so my weekend game plan is waiting for me.
Atlanta events browser workflow (Challenge 6): Grok browses discoveratlanta.com and pulls together things to do in Atlanta.

It was cool to create a skill with Grok. It was a slight challenge getting used to using Grok's "computer" and the concept of that. Teach a Skill wouldn't work properly so I had Grok start its computer then we were off to the races.

The quick wins

Cursor Pro sign-ups
Tiger Cloud CLI + MCP signup

What I learned

Small apps are the best way to learn a new tool.
Comparing models side by side changed how I would pick them. I never did a comparison like that before with different models.
Having Grok do something for me on a schedule felt cool but I need to see how I can apply it better to suit my life.

It was my first time participating in Global Hack Week with MLH. I really enjoyed it. It was cool to build from my couch while I recover from ankle surgery. I'm looking forward to next year!

What's next

I'm going to be diving in more with Grok Bot and how I can use it to benefit my life. I did get the X Subscription that includes X Premium, Grok, Grok Bot, and Cursor. I already had a sub to Grok so it's basically the same price as the bundle which is great. Now I have access to more tools for the same price each month!

Thanks to MLH, DEV and the Hacktoberfest team for a fun week. If you joined Global Hack Week too, tell me what you built in the comments! 👇

Off-Grid Trails: A Trail Finder That Still Works When the Bars Are Gone

Tanya Mott — Sat, 10 Oct 2026 21:21:44 +0000

This is a submission for the Hacktoberfest Open-Source AI Challenge Week 1: Touch Grass

What I Built

In the North Georgia mountains and the Smokies, your phone becomes a brick. You park at the trailhead with full bars, and ten minutes up the trail they're gone. That's exactly when you start wondering: Am I still on the trail? How far back is the car? Is there water nearby?

In September 2019, I hiked Panther Creek Falls alone with my two dogs. I misjudged how far it was to the waterfall and didn't pack enough water for all three of us, and I ran out before we even reached the falls. The trail was treacherous, with tree roots the entire way, over 7 miles out and back, and I don't remember having any cell signal. I was lucky to find a Girl Scout camp near the falls. They gave us fresh filtered water and snacks, and they probably saved my life. I rested there and at the falls for a while. Since the trail was an out-and-back, I knew the way back, but not how far I had left. It started raining on the walk out, and I've never been so thankful to see my car parked on the side of the road. I wish I'd had an app that showed me nearby camps and water. I thank God for those Girl Scouts.

So I built Off-Grid Trails, a phone app that does its job with zero signal.

Download a trail pack before you go. One tap on Wi-Fi saves an area's trails, waterfalls, springs, viewpoints, peaks and shelters to your phone. I started with five spots I love: Vogel State Park & Blood Mountain, Amicalola Falls, Laurel Falls, Clingmans Dome, and Alum Cave & Mount LeConte.
"Nearest trail" and "You're on it ✓." GPS works without cell service, because your phone talks to satellites, not towers. The app tells you which trail you're on, or how far away the nearest one is and in which direction.
"I parked here." Drop a pin at the trailhead, and an arrow points you back to your car with the distance.
Breadcrumbs. An orange line records the path you actually walked. Retracing it is safer than cutting straight through the woods toward the car.
Ask Gemma, on your phone. A small Gemma model runs entirely on the device. Tap "I think I'm lost" or "Closest water" and you get the facts from your trail pack plus a calm tip from Gemma, or type your own question. No server, no signal, nothing leaves your phone.

Who it's for: anyone who loves trails where the bars disappear, and anyone who's ever wished they'd known exactly how far they had left. I'm excited to go hiking again next year once my ankle heals. I'm looking forward to testing out this app in real time and making necessary tweaks.

A lot of people skip the trails with no service because it feels risky. This app is meant to take a little of that worry away, so you can put the phone in your pocket and actually look around.

The screen is the shortest part of the experience: two minutes on Wi-Fi at home, a tap at the trailhead, and then the phone stays in your pocket unless you need it.

The app is a companion, not a replacement for a paper map, water, and telling someone your plan. It says so right in the app.

Demo

Live app: https://off-grid-trails.onrender.com (open it on your phone, download a pack, then turn on Airplane Mode)

Heads-up: it's on Render's free plan, so the first load after it's been idle can take up to a minute. After that, it's saved to your phone.

Taking it outside

I'm recovering from ankle surgery, so a real hike will have to wait until next year. Instead, I tested everything from home in Airplane Mode: I downloaded packs for Vogel, Laurel Falls and Clingmans Dome, used Demo walk to "hike" the Appalachian Trail and Sugarland Mountain Trail, dropped car pins, and asked Gemma for help, all with zero signal. I'm looking forward to going on a hike next year with the app as my guide.

Code

tmott13 / off-grid-trails

Off-Grid Trails

An offline trail finder for when there's no cell service. Built for the North Georgia mountains and the Smokies.

Download a trail pack on Wi-Fi before you go. After that, everything works in airplane mode:

Map of nearby trails (OpenStreetMap data, drawn on the phone, no map tiles needed)
Nearest trail with distance and direction
"I parked here" car pin and a live arrow back to it
Breadcrumbs of the path you walked, so you can retrace your steps
Nearby water, waterfalls, viewpoints, peaks, shelters and trailheads
Ask Gemma: a small Gemma model runs on the phone with WebLLM (WebGPU). It only answers from the facts in your pack and your GPS. The question buttons also work without the model.

This app is a companion, not a replacement for a paper map, water and telling someone your plan.

Run it locally

Needs Node 22.22.3+ (Node 24 recommended).

…

View on GitHub

How I Built It

Frontend: Angular 22 with signals, built phone-first. Angular's service worker caches the whole app, so it opens from the Home Screen in Airplane Mode.
Offline storage: trail packs, the car pin and breadcrumbs live in the phone's IndexedDB.
Map: no map tiles. The trails are drawn as SVG lines straight from the pack data, which keeps packs tiny (a whole park is a few hundred KB) and avoids bulk-downloading anyone's tile server.
Trail data: OpenStreetMap, through the Overpass API. My Node/Express server turns raw OSM data into a small "pack." Public Overpass servers often turn away requests from cloud hosts, so I "bake" the preset packs on my laptop and ship them with the app. Render just serves them.
On-device AI: Gemma 3 1B through WebLLM, running on the iPhone's GPU with WebGPU. It's a one-time ~700 MB download on Wi-Fi, and then it's cached on the phone.
Hosting: one Render web service serves the app and the packs.

I built this with Claude as my pair programmer. It helped me scaffold the app, write the server and debug on-device AI. I made the product calls, picked the trails, and tested everything on my own phone in Airplane Mode.

What I learned about running AI on a phone

Getting Gemma onto an iPhone was the hardest part of this project.

The first attempt crashed Safari. "A problem repeatedly occurred." The phone ran out of memory loading the model, then crashed again every time the app reopened and tried to load it. I added a crash guard: if Gemma takes the page down, the app remembers and never auto-loads it again.
Then it wouldn't start at all, because of a settings conflict in how much text the model can hold at once. Shrinking that window to 1,024 tokens fixed the error and cut memory use.
Then it worked, and it looped. My first offline answer was "The closest water source is a stream" about fifteen times. Small models do that. I cut its answers short and filtered out repeats, and the loop was gone.
Then it got the directions wrong. Next I let Gemma reword the app's answers, with a check: if a distance or direction changed, the app showed its own answer instead. The check caught Gemma on almost every answer. A 1B model is great with words and shaky with numbers.

So I split the job. The app owns the facts: names, distances, directions, word for word. Gemma adds one short, calm tip underneath, like "Stay put and keep your eyes open." Any tip that mentions a number or a direction gets thrown out. Gemma can make the moment feel less scary, but it can't send you the wrong way.

That split is the decision I'm proudest of. When you're lost, a confident wrong answer is worse than no answer.

Why Does Open Innovation Matter?

It runs where the signal doesn't. An open model can live on my phone. A closed API needs a connection, which is exactly what you don't have on a mountain.
Private by default. My location and questions never leave the device.
Free to run. No API bill, no subscription. The trail data is open too, thanks to OpenStreetMap contributors.
Mine to shape. I could shrink the model's memory, rewrite its rules, and add a safety check, because I control the whole stack.

Prize Categories

Gemma: Gemma 3 1B runs on-device in the browser with WebLLM, with zero signal. The app keeps every fact exact, and Gemma adds a calm tip that passes a safety filter.
Render: the Node/Express server and the Angular front end run as one Render web service, which also serves the pre-baked trail packs.

Thanks to the DEV and Hacktoberfest teams, and to OpenStreetMap contributors for the trail data (ODbL). Built from my couch while my ankle heals, for the trails I can't wait to get back to. 🥾

Let's Not Be Hangry: An Open-Model App for My Boyfriend, Who Forgets to Eat

Tanya Mott — Sun, 04 Oct 2026 22:58:31 +0000

This is a submission for the Hacktoberfest Weekend Challenge: Build for a Friend

What I Built

My boyfriend has been staying with me while I recover from ankle surgery. He's been taking care of me, and I noticed he wasn't taking care of himself. He forgets to eat. When he's busy, lunch just doesn't happen. And because it's my kitchen, he's hesitant to help himself to anything.

So I built Let's Not Be Hangry, a tiny app with one job: make eating faster and easier than skipping.

"How much time you got?" He taps 1 min, 5 min or 15 min, and Gemma picks something from my kitchen that fits, tells him exactly where it is ("freezer door"), and how to eat it. No-cooking options come first.
A "fair game" list. I filled it with everything he's welcome to. If it's on the list, it's his. No asking, no guilt.
"Finished it 🛒" adds the item to a restock list for me, so "I ate the last yogurt" becomes a helpful heads-up instead of an apology.
Meal-time nudges. If nothing's been logged by the end of his lunch or dinner window, he gets a friendly reminder that Gemma writes fresh each time, so it never gets stale.
A big "I ate!" button that's always in reach of his thumb.

The rules I gave the model: be warm, short and a little funny. Never mention calories, diets or guilt. Just help him eat something.

What he said when I handed it to him:

"It's pretty cool"
"It took a bit to figure out but seems self-explanatory"
"The colors makes it easy to navigate"
"It helped me decide what to eat with the time I had available"
"The reminders were helpful"
One of the first picks it gave him: String cheese, fridge door. "She'd much rather you be fed than hungry, so go for it!"

Demo

Live app: https://lets-not-be-hangry.onrender.com

Heads-up: it's on Render's free plan, so the first load after it's been idle can take up to a minute.

Code

tmott13 / lets-not-be-hangry

Let's Not Be Hangry

A tiny app for someone who forgets to eat. Tap how much time you have (1, 5 or 15 min) and Gemma, an open-weight model, picks something from the "fair game" list and says where it is. "I finished it" adds the item to a restock list. Meal-window reminders show up if nothing was logged.

How it's built

Angular 22 frontend (signals, zoneless)
Node/Express server (server.mjs) that serves the app and forwards /api/chat to Gemma
Gemma, two ways
- LLM_PROVIDER=google: Gemma through Google AI Studio (works anywhere, e.g. on Render)
- LLM_PROVIDER=ollama: Gemma through local Ollama (nothing leaves your machine)
The fair-game list, restock list and log are stored in the browser (localStorage).
If the model can't be reached, the app falls back to a built-in "demo mode" pick.

Run locally

Needs Node 22.22.3+ (or Node 24).

npm install
npm run build

Option…

View on GitHub

How I Built It

Model: Gemma 4 31B, an open-weight model, served through Google AI Studio so it works on his phone anywhere.
Local inference: flip one environment variable (LLM_PROVIDER=ollama) and the same app runs Gemma locally through Ollama on my laptop, and nothing leaves the house.
Server: a small Node/Express server that serves the app and handles one endpoint, /api/chat. It decides where Gemma runs, keeps the API key out of the browser, and adds a simple rate limit so the public demo can't be abused.
Frontend: Angular 22 with signals and the default zoneless setup. It's phone-first, with chunky, playful buttons and a sticky bottom bar. The lists live in the browser's localStorage.
Resilience: if Google returns an error, the server retries, and if that model is still down, it automatically switches to another Gemma model my key can use. If no model can be reached, the app falls back to a built-in pick, so it never leaves him empty-handed.

I built this with Claude as my pair programmer. It helped me scaffold the Angular app and the Node server, fix bugs, and work through hosting options. I made the product calls, designed the experience around him, and deployed it.

The trickiest part wasn't the UI. It was the model. The Gemma version I started with wasn't available to my key anymore, and the bigger one sometimes threw server errors. Instead of hardcoding a fix, I had the server ask Google which Gemma models my key can actually use and fall back gracefully. It's a small reminder that open models come in a family, and you can swap between them.

Why Does Open Innovation Matter?

This app knows his routines: when he eats, when he doesn't, what's in our kitchen. That's personal. Building on an open model means I get to decide where that information goes.

Swappable: the same app runs on hosted Gemma or on local Gemma with a one-line config change. I'm not locked into one company's API.
Private when it matters: in local mode, Gemma runs entirely on my laptop with Ollama, so nothing goes to a server I don't control. A closed API can't offer that.
Cheap to keep alive: it runs on a free tier of hosted Gemma, or on a small local Gemma on my laptop. No subscription required.
Mine to shape: I can change the prompt, the tone or even the model itself without asking permission.

A closed API would have worked for the demo, but this is the version I'd actually want running in my home.

Prize Categories

Best Use of Gemma: Gemma 4 31B picks every meal and writes every nudge, with a local Gemma mode through Ollama.
Best Use of Render: the Node server and Angular app run as one Render web service.

Built with love for my favorite forgetful eater. 🍌

Why I Finally Rebuilt My Portfolio in Angular 22 (And What Jumping from Angular 12 Taught Me)

Tanya Mott — Sat, 03 Oct 2026 23:14:29 +0000

A few weeks ago, I opened my personal website and felt that familiar pang of developer guilt.

My site was frozen in time—running on Angular 12 and showcasing work from years ago (ASP.NET MVC, C#, AngularJS, and transitions through early enterprise versions). While that foundation taught me how enterprise software scales, looking under the hood felt completely disconnected from what I actually do every day.

At my day job, I work in production Angular 19, building high-density freight audit ledgers, embedded Stripe and Plaid checkout rails, and custom monorepo workspaces. Yet, my personal site was still carrying the weight of a decade-old legacy footprint.

I didn't throw away my domain or start over from scratch elsewhere—I sat down and did a complete rewrite from the ground up, jumping ten major versions directly from Angular 12 to Angular 22.

Here is what went into the rewrite, the leap across ten versions, and what I learned along the way.

1. The 10-Version Leap: Angular 12 to Angular 22

Jumping from Angular 12 straight to Angular 22 feels like stepping into an entirely different framework—in the best way possible.

In Angular 12, simple features still required an incredible amount of boilerplate ceremony:

Bloated NgModule declarations tying components together
Heavy zone-based change detection running dirty checks everywhere
Repetitive RxJS subscriptions for basic synchronous component state
Verbose structural directives (*ngIf, *ngFor) littering templates

Rewriting the codebase directly in Angular 22 stripped that cruft down to essentials:

Zero NgModules: Completely standalone architecture where components only import what they use.
Built-in Control Flow: Replacing structural directives with modern @if and @for syntax made templates dramatically more readable and cut bundle overhead.
Signals-First Reactivity: Moving local UI state to fine-grained Signals eliminated manual subscription cleanup and unnecessary async pipe chains.

Instead of fighting legacy upgrade paths incrementally, rewriting the codebase cleanly unlocked modern build speeds, microscopic bundle sizes, and a developer experience that actually feels fun.

2. Replacing the "Resume Checklist" with Real Problems

When you have been writing code for a while, the default trap is listing every library, runtime, and tool you have ever touched. But a giant list of 30 logos doesn't tell anyone what you actually solve.

Instead of keeping that passive list, I structured the rewrite around real production challenges:

Handling Financial Flows Securely: Integrating Stripe Elements and Plaid Link for ACH and credit card processing. In financial checkout, it's not just about rendering an input; you have to manage strict tokenization boundaries, handle asynchronous webhooks, and build optimistic state updates with graceful failure recovery.
Fixing State Leaks: Moving away from broad global state caches that can accidentally preserve sensitive checkout tokens across routes. Migrating to route-scoped @ngrx/component-store instances tied checkout streams directly to the component lifecycle, cutting memory overhead by 42% and eliminating stale session state.
Daytime Continuous Delivery with Kubernetes: For a long time, enterprise deployments meant stressful, off-hours maintenance windows to prevent broken sessions. This year, our team migrated the frontend onto Kubernetes clusters. Today, our delivery pipeline runs like clockwork:
- Azure DevOps drives our sprint planning and backlog execution.
- GitHub manages our repositories, pull request reviews, and deployment triggers.
- Kubernetes handles rolling zero-downtime updates with automated health probes.
- Split.io & Harness decouple code deploys from feature releases via canary toggles.
- Grafana gives our team real-time visibility into pipeline build times, ingress health, and client error rates.

We went from dreading after-hours release windows to shipping zero-downtime updates in the middle of a Tuesday afternoon without interrupting active user checkout sessions.

Every project card on the new site includes a deep-dive drawer that breaks down the original business problem, technical deliverables, concrete metrics, and architectural takeaways.

3. Building a 12-Card Skills Grid (and the SVG Math That Broke My Layout)

Instead of a generic chip list, I built an interactive 12-card skills grid organized into clean, complementary pairs:

Core Architecture: Angular 19 & TypeScript
State Architecture: Angular Signals & NgRx ComponentStore
Reactive & Workspace: RxJS Streams & Angular Monorepo
Design Systems: Figma Tokens & Tailwind / SCSS
Enterprise Platform: Stripe & Plaid + .NET / C#

This seemed straightforward until I started building the custom inline SVGs for each card.

A few visual bugs quickly showed up:

Aspect Ratio Issues: One icon used a vertical 256x384 coordinate space inside a square container, which compressed it into a tiny letterbox. Normalizing everything to a consistent 256x256 bounding box brought back consistent sizing.
Clipping on High-DPI Screens: A Tailwind path had coordinates extending past the viewBox boundary, silently cutting off roughly a third of the wave graphic.
Compound Brand Layouts: Putting Stripe and Plaid into a single card required manual coordinate offsets and scaling so neither logo crowded the other.

Getting all 12 cards aligned symmetrically across mobile, tablet, and desktop took plenty of trial and error, but the end result is fast, responsive, and readable.

4. The Enterprise Reality vs. The Personal Lab

One question I had to answer was: Which Angular version should I highlight?

In enterprise engineering, you don't rewrite critical production apps the moment a new framework version is released. At work, our core applications run stably on Angular 19. It is reliable, deterministic, and supports high-volume financial workflows where stability is non-negotiable.

For my personal site rewrite, though, I had no legacy constraints. Rewriting it in Angular 22 let me work directly with the latest signal primitives and zero-debt setups.

Highlighting both is honest: it demonstrates knowing how to keep enterprise production software stable while continuously experimenting with modern tools.

5. Key Takeaways from the Rewrite

Don't fear the version jump: Moving across ten framework versions sounds daunting, but starting with a clean rewrite instead of chaining 10 migration CLI passes let me adopt modern idiomatic patterns immediately.
Delivery maturity is frontend engineering: A frontend engineer isn't just writing components. Understanding how your bundle is packaged into Docker, deployed on Kubernetes, toggled via Split.io, and monitored in Grafana makes you dramatically more effective at work.
Be specific about domain work: Anyone can say they "integrate APIs." Explaining how you tokenized corporate bank accounts through Plaid Link or automated freight invoice audit rules proves actual hands-on business impact.
Treat your own site like a real project: Responsive breakpoints, clean accessibility, component lifecycle cleanups, and lean build budgets belong on your personal domain just as much as an enterprise app.

You can check out the live site here: tanyamott.com

When was the last time you overhauled your personal site? Have you made a multi-version framework leap recently? Let's chat in the comments!

Building My Own AI Command Center

Tanya Mott — Fri, 02 Oct 2026 02:09:10 +0000

Why I built it

I spent one evening building a personal AI command center, and it now writes me one short briefing every weekday at 9 AM. Not a productivity system for a business. A briefing for my life.

I'm a frontend developer, a writer, and an Enneagram Type 9. Type 9s are great at keeping the peace and terrible at remembering their own priorities. My days fill up with other people's asks, and the things I care about quietly slide.

The spark came from Erika Stanley's AI Queens episode, "Claude Command Center: Stop Drowning in Email, Slack, and To-Do Lists." Hearing her walk through her setup made me realize I could build one around my own life.

So I wanted one place that puts my priorities first, every morning, in five things or fewer. October gave me the perfect test: Hacktoberfest, a reading habit I'm trying to build, and recovering from ankle surgery, all at once.

What lands every weekday morning

Every weekday at 8:59 AM, a scheduled Claude task reads my email, calendar, podcasts, and daily log, then sends me one briefing. The rule I gave it: five things that matter beat twenty that don't.

It always starts the same way:

What's still open from yesterday, at the very top
Quick wins: up to five things I can finish in about 10 minutes, with time estimates
The one most important thing today
Weather, energy, recovery, reading, and one awareness line
Hacktoberfest progress, emails worth answering, what's due
One or two focus ideas, offered as options, never orders

Each day has its own mode, so the week has a rhythm:

Day	Mode	What changes
Monday	Set up the week	Week at a glance, deadlines, a suggested top 3
Tuesday	More time	One meatier block of real work
Wednesday	Mid-week check-in	Done vs. slipping, one adjustment, no report card
Thursday	More time	The one bigger thing to finish before Friday
Friday	Fun Friday	Lighter tone, wins, weekend weather, something fun nearby

The pieces under the hood

The whole system runs on three simple parts: a plain-text log, a few trackers, and some ground rules about tone.

A daily log I talk to. A file called carryover.md has a dated entry for each day with four sections: Done, Didn't get to, Came up today, and Carry forward. At night I just say what happened ("read 12 pages, got the DevRelay sticker") and Claude sorts it into the right place. It only ever adds, never deletes. The morning briefing reads it, so nothing I said slips through the cracks.

Trackers that fit this season of life. Right now it tracks my ankle recovery, a 10-pages-a-day reading habit, what I'm learning, and my Hacktoberfest stickers. Habit tracking like water and steps is paused until I'm healed. A tracker that makes me feel behind is worse than no tracker.

Frameworks as options, not rules. I use Human Design, the Enneagram, and my INFJ-T type as self-reflection tools. Each briefing gets exactly one awareness sentence from them, written fresh. Every suggestion is framed as something I can respond to. Big decisions get "sleep on it, then decide by ___." And one hard rule: no guilt, no "you should have."

Hacktoberfest 2026: chasing 15 stickers

My top priority this month is Hacktoberfest, and I'm aiming for 15 stickers, the maximum prize tier. By the end of day one I had 5.

I've done Hacktoberfest before, back when it was all about pull requests, so I was surprised by how much changed this year. Pull requests no longer count toward rewards. Instead you collect virtual stickers in a sticker book by doing things: DEV Challenge posts, livestream check-ins, Global Hack Week, connecting tools, and surveys. There are 24 in total. Two are in-person, which I'm skipping while I recover, so 22 is my real maximum.

The command center made this easy to plan:

It mapped every sticker to its deadline and picked a path to 15 by mid-October.
It flags each DEV Challenge the day before it closes. They close at 2:59 AM on Mondays, which is really Sunday night.
It filters 33 livestreams down to the evening and weekend ones I can actually catch live, since check-ins need the code on screen.
It turned the four "do it anytime" stickers into quick wins. I knocked out all four on day one.

Next up: the Launch Weekend DEV Challenge. Build something small, write it up, post it by Sunday night.

What I learned in one evening

The biggest lesson: a good system says no more than it says yes.

Fewer trackers win. I was tempted to track everything. Every tracker is something I have to log at night, so I kept only what matters this month and paused the rest.
Check the rules before you plan. I almost set a pull-request goal. Reading the actual Hacktoberfest site showed PRs don't count anymore, and the whole plan changed.
Keep work and personal separate. I skipped connecting my work calendar and sprint board, and I used my personal Claude account, not my work one, for my Hacktoberfest tools. My open-source work should be clearly mine.
Tone is a feature. "Options, not orders" and "no guilt" do more for me than any clever automation. If the briefing made me feel behind, I'd stop reading it.
Start small and imperfect. My first book is 10 pages a day. My first DEV post will be something quick. Done beats perfect.

What's next

Tomorrow is the first real briefing, and it happens to be Fun Friday. Over October I'll find out whether a calmer, shorter morning actually changes what I get done.

Here's what I'll report back on at the end of the month:

[ ] Did I reach 15 Hacktoberfest stickers?
[ ] Did 10 pages a day turn into a finished book?
[ ] Which parts of the briefing did I actually use, and which did I skip?

If you build something like this, start with one question: what are the five things you'd want to know before 9 AM? Everything else can wait.

My Futuristic Portfolio!!

Tanya Mott — Fri, 30 Jan 2026 06:22:48 +0000

This is a submission for the New Year, New You Portfolio Challenge Presented by Google AI

About Me

Hi everyone! I'm Tanya, a senior software engineer from Atlanta, GA. I focus on frontend development with a focus in Angular and the Microsoft stack/ecosystem. This is the first website/app I've built using pure AI and I'm very excited to share it here below. I'm looking forward to learning more about AI and building more cool things in the near future.

Portfolio

How I Built It

I built my portfolio using Google's AI Studio. It was my first time using it and I found it to be very fascinating. I spent the past two weeks creating it, off and on, making tweaks until I got it to where I fully love it enough to submit! I learned a lot about AI Studio and how to prompt to get the changes I wanted implemented.

What I'm Most Proud Of

I'm really proud of myself for diving in head first into creating a website/app from scratch using AI Studio. The initial version looked super rough and plain but with some really thoughtful prompting and further tweaking through follow-up prompts, I was able to create a beautiful website that is functional and shows my personality.

I love the logo image generator, I am truly so fascinated with AI image generation, it is truly magical. To be able to implement an image generator within an app that was also generated is pretty cool. I am in awe of how images are generated within seconds and can't wait to learn more about how exactly that all works.

Not going to lie, I am an Angular developer and this application is written in React out of the box but I was still able to read the code and make tweaks within the code as well, not just rely on AI. Perhaps I will generate an app that translates React to Angular or vise-versa OR maybe I could just prompt AI to do it for me (lol).

Bonus points: I generated my cover photo in chatgpt using a prompt it suggested from checking out my portfolio. The colors matches perfectly! 🤩

Thanks for checking out my portfolio & good luck to all the participants! This was fun...thank you dev.to! 🚀✨

I'm Still Living My Dream as a Software Developer

Tanya Mott — Tue, 03 Mar 2020 15:36:30 +0000

Five years ago, I started my journey professionally as a software developer after attaining my BS in Information Systems degree.

I wrote in a previous post more about my software development experience and my struggles but to summarize...

1) The road has not been close to easy, plenty of roadblocks, speed humps, pot holes... you name it.
2) Mental emotional abuse was real in the workplace.
3) Managed chaos and unrealistic deadlines.
4) Getting laid off for BS reasons - where I live, Georgia, it's a right to work state.
5) Dealt with incompetent and jerk bosses.

Even going through all of that, it didn't stop be from continuing to pursue my dream. It's what I wanted to do since high school, how could I let it stop me?! I knew if I could manage to stay in my field for five years that it would get better, and it has. Now, I'm working for the best company so far in my career. I've been able to become more picky in my company selection after gaining more experience. Sometimes, we have to take what we can get in the moment in order to succeed. I think for women, it's harder on us, I still experience some struggles but it's getting better. I'm used to being the only woman developer on past teams and now currently. I'm OK with it though, sometimes it's nice to be 'special'.

We still need more women in tech but I am happy at the direction we are going since I started my career.

I am proud to be a woman software developer!

Thanks for reading!

Sometimes Letting Go is Hard in Our Career

Tanya Mott — Thu, 20 Feb 2020 03:05:37 +0000

Sometimes in our career, we are super hard on ourselves. Whether it's not thinking you're good enough for that next role or position, or maybe a mental blocker is blocking you from achieving your goals. Whatever it is, we've all had some struggle that blocks us from achieving our best.

In my previous article, I talked about how a company laid me off last October. I have had my share of negative feelings since then, trust me. Sometimes you got to really believe it's for the better. I have to give credit to Applied Resource Group, and to an awesome man named Dan - who is a recruiter - now manager - there. Dan placed me in my two last roles. I'm forever in his debt, seriously. But anyway, tonight was one of their networking events, their 10th anniversary -at Pontoon Brewing, which is a big deal! Congrats ARG!!!

ARG has hosted many events that I've attended, some post prev job, and all of them have been a blast. Since ARG is a partner with my prev company - I'll just go ahead and name Improving - my old boss (Scott) and HR (Nancy) - show up frequently to their events. It's no brainer that I would/will show up and they would be there, so I might as well get used to it. At first tonight, I was avoiding them, shy to introduce myself, again; but after a few beers, I gained enough courage to do so. I went over to say hey, and immediately I was greeted with the same smiley faces, that I once remembered. It was warm and welcoming. Even the CEO was there visiting, it was nice to see him again, even thought he didn't remember me. We chatted for awhile and it was nice. When it was time for them to go, we said our goodbyes and separated.

Afterwards, I could feel a weight lifted off my shoulder, it was as if all that stress and anxiety was gone and it was such a freeing feeling. I was so worried about what they would think of me that it blocked me from my healing. I can now move on, without feeling like I have regret. I can now feel fully confident in my current role, and feel secure in my feelings - that I am great and special and all the things that I truly am.

Sometimes, we have to do what seems to be such a hard task, to accomplish something so great!

When I first arrived and before I walked in the door tonight, I saw my current boss, the one that just left the office! We said hey and I walked in. Immediately I was greeted with the news that my boss shared - saying that I am great and so awesome! Yes - me - I am so awesome! Like I hadn't heard real feedback from him yet (but you know how you can tell) - but I am super flattered. I heard all that good news about me, that I went up to my old employer's face and faced my demons. I feel accomplished, I feel worthy.

We need to face our demons more, they hold way too much power over us. My rough experience has caused mental harm that I am overcoming. We shouldn't be ashamed of our past, because it is what has got us to where we are today.

Five years into my software development career, and now it can be the best year ever because I have finally let go of what inhibits my growth.

I courage you to go be great and to let your past be the past and to let go of what inhibits you.

Thanks for reading!

How My Software Development Experience Changed My Mental Health

Tanya Mott — Thu, 20 Feb 2020 02:21:18 +0000

Mental health is something that is not mentioned enough, especially in the tech industry so I wanted to share my story.

I first became a software developer February of 2015, so about five years ago. It was almost two years after graduating with my BS in Information Systems degree. I already thought I was “behind” back then, because I couldn’t find a job right after college. I was working full-time as a technical writer after I graduated but continued the job search.

I remember interviewing at Bluetube Interactive (now, no longer exists)…the interview was over two hours long. I didn’t do too well on the technical exercise on the computer, but the manager gave me a chance anyway, in hopes that I learn and grow. I only lasted there three months, before my manager fired me. He gave me an “ultimatum” in that, if I didn’t finish a project in two weeks, that he would let me go. I remember sitting in his office when he told me that. I wasn’t allowed to ask for help, even though I was learning 3 new technologies on the job (C#, Entity Framework, and responsive design). I learned .NET in college but it was with VB.NET. That really set the tone for most of my experience going forward. I was underappreciated and emotionally abused during those 3 months, it was rough.

I was unemployed for a month before moving on to PowWow HR (also no longer exists). This company was at the Atlanta Tech Village as a startup, which back then, I thought was pretty cool. Turns out the micromanagement was pretty emotionally draining and abusive. Being in a small room, with your boss/CEO walking around and making sure you do your job everyday is not ideal. One day, in the middle of a week, my aunt passed away from cancer. It was sudden, even though she had cancer, so I was pretty upset. I found out after work and went in the next day. My boss could tell I was pretty upset, so he told me to go home for the day, so I went to see my mom. I came in the next day and everything seemed fine. Later on that week, they let me go. The reason being the deadline didn’t get met, even though it was an unrealistic one to begin with.

I was unemployed for two months before finding my next job at Project Time & Cost. This was the first decent company I’ve worked for, everything was good…until my CTO hired a new team lead 8 months after I got there. Things went south pretty quickly and I ended up leaving voluntarily after a year. The new team lead was a micromanager who was also a fraud, who loved to demonize us developers. A lot of us jumped ship during that time.

My next job at BreakAway Loyalty came smoothly after, I started right after leaving my previous job. Everything was great there until I had to work OT to meet a drastic deadline but no emotional abuse. I ended up leaving voluntarily after staying 2.5 years, my longest running job to date.

I then went on to Improving Atlanta, a consulting company, which was absolutely horrid to begin with. Loved the culture but hated the work. What little spark and passion I had for technology, died there. After being burned out at BreakAway, I needed a good place to recover but IA wasn’t it at all. I ended up getting laid off, with no notice at all.

After two months of unemployment (which was hell btw, but I’ll share in another post) brings me to my current company, CRH, which has been absolutely amazing so far. I have a wonderful boss, the best one I’ve ever had, I believe. Everything is almost perfect and a true “dream” job. The only problem is that I no longer have my passion “spark” that I once had and I am not sure how to get it back. I’ve only been with CRH for not even 2 months but I struggle with demonizing thoughts at least weekly. It’s horrible for my mental health. I know I need to see a therapist but I am waiting til I am financially able. Yes, I’m kind of in a “lull” stage cause I’m new and we are starting a new project, which is exciting btw. Rewriting an app from Angularjs (v.1) to Angular (v.9) is exciting, I love Angular. I was hired to do this project! But I’m afraid that my demons are going to kill everything and I’m not sure what to do except talk to a therapist. I remember when I interviewed, it was my last interview, as I received a verbal offer 2 hrs after I left. I remember my passion and excitement, the same feelings that got me the job. Those feelings are fading away but I hope they come back soon! Everyday is a new opportunity to change thoughts, I just have to take it in strides and hope time heals. I hope I get back to being “me” soon because I miss that drive and passion I once had.

What has helped me the most in the past, and still continues to do so, is running and exercise. Also having a good support system.
I hope my story inspired you, I wanted to share with the world because it’s been so hard over the last 5 years for me, especially being a woman developer.
Thanks for reading!

Working Remotely...

Tanya Mott — Wed, 10 Oct 2018 16:59:26 +0000

I have two questions about working remotely...

1) Can you really work anywhere?

2) Can you work out of state if you move?

I'm considering moving out of state and wanted to see if it would be feasible to obtain a remote job here or in my future city?

Thoughts?

Thanks!