Learn

Build Phlo Poll: a real realtime application in eight steps. Every step ends with something running. No prior knowledge needed beyond a terminal with Docker.

1SetupIn this tutorial you build Phlo Poll: a small poll app that asks "Which stack wins?". You start from an empty folder and end with a styled, multilingual, realtime poll. Each chapter adds one layer: a route, a view, CSS, data, voting, async updates, translations, and live results. In this first chapter you install Phlo, write your first route, and see it in the browser. 2ViewsViews live directly in your .phlo files and compile to PHP methods that return HTML. In this chapter you replace the hello route with the first real poll page: a question and a row of answer buttons. You learn the view block, the dot shorthand, variables, and the one rule that bites everyone once: a blank line closes the view. 3CSSPhlo has its own compact CSS syntax: no semicolons, no braces required for single rules, and $variables that compile to CSS custom properties. In this chapter you give the poll a dark card layout and a small theme, in a dedicated style file. 4DataThe poll needs storage. Phlo's ORM defines a table as a class, and for a tutorial app the JSON file driver is perfect: no database server, no credentials, one JSON file per table. In this chapter you define the model, seed it with options, and render real records. 5VotingA poll without votes is a list. In this chapter every option becomes a form, a POST route receives the vote, the count goes up, and a redirect re-renders the page. Plain HTTP, no JavaScript yet: this version works in any browser, with everything off. 6AsyncNow make voting instant. Phlo's frontend runtime intercepts forms and links marked async, posts them in the background, and applies the server's DOM commands to the page. No reload, no client-side state, no API layer: the same route answers both worlds. 7TranslationsPhlo treats translation as a rendering concern: you write view text in your source language, mark it, and the lang resource serves the right language at request time, translating missing entries in the background. In this chapter the poll learns Dutch under a /nl prefix. 8RealtimeOne gap remains: when someone else votes, your tab does not move. In this final chapter the server pushes results to every open browser through phloWS, and then you ship the whole thing. The realtime part is optional: it requires the separate phlo-websocket Node service, and the poll is complete without it. The shipping part is not optional.