A social networking demo built on the Solid framework, presented at NationJS. It replicates familiar social-network features (profile, friends, timeline) by reading decentralized Linked Data from a user's Solid pod rather than a central database.
Solid (Social Linked Data) is a specification led by Sir Tim Berners-Lee that lets users store their data in personal online data stores called pods. Apps read from and write to pods using standard web protocols, giving users full ownership of their data.
- Node 22 (see
.nvmrc) — use nvm or nvm-windows - A WebID — a URL that points to your Solid profile document. You can get one from a public identity provider such as solidcommunity.net
npm install
npm start # dev server → http://localhost:5173
npm run build # production build → dist/- Open the app at
http://localhost:5173 - Enter a WebID in the navbar and click View
- The app fetches the profile document and displays biographic data, pages, friends, and timeline entries
| Person | WebID |
|---|---|
| Ruben Verborgh | https://ruben.verborgh.org/profile/#me |
| Sarven Capadisli | http://csarven.ca/#i |
| Kingsley Uyi Idehen | https://id.myopenlink.net/DAV/home/KingsleyUyiIdehen/Public/kingsley.ttl#this |
The app uses @solid/react to bind Solid pod data directly to React components. Profile properties (first name, friends, weblog, etc.) are fetched via SPARQL-like queries against the user's Linked Data profile.
- Vite 5 — build tool
- React 16 — UI framework
- React Router 4 — client-side routing
- styled-components — CSS-in-JS
- @solid/react — Solid data binding
The project is configured for Netlify via netlify.toml. Push to master to trigger a deploy; all routes redirect to index.html for SPA navigation.