devlog #4 (final)

its actually on the internet now :D

last time you tab still said “thats you. profile later.” and the whole thing lived on localhost. felt unfinished so i finished it today itself.

you tab is a real profile now. display name, bluesky handles one per line, story rings you can add or hit x on. save this and home grabs a new mix. first ring on my laptop says athan lol.

wrote a readme that is not just a tutorial, put actual screenshots of the tab in it, pushed to github, threw it on vercel. people can actually open it without cloning anything.

demo: https://webgram-gamma.vercel.app
(waiting for dns to propogate so that it can be accessed using custom link, https://webgram.techxtreme.me )

code: https://github.com/its-techxtreme/WebGram

chrome empty new tab is fired. this is the one im using +_+

devlog #3

the feed is actually scrolling now :D

last time it still said “feed goes here. not yet.” and the clock was stuck on --:-- like it was buffering forever. got bored of staring at a fake phone with nothing on it.clock ticks now.

search actually dumps you on google. the story rings open the apps (google, youtube, github, stardance, discord) and i put names under them because i kept mixing up which circle was which lol.

then i hooked up bluesky. public api, no login, just a list of people i follow on this laptop. mix of cats, nba, zoo animals, 90s anime, street food. photography only got old after like two refreshes. posts are a little polaroid-tilted. hover the rings and they spin. one tap on a pic opens the real bluesky post. double tap and a heart pops. like and save stay here, im not actually hitting their servers.saved tab shows what i bookmarked. you tab still just says “thats you. profile later.” thats next, then i put this on the internet instead of localhost.anyway. i open a new tab and theres stuff to scroll. thats the whole point +_+

devlog #2

it looks like a phone now :D

spent an hour just making it not ugly. no new buttons or anything. just css.

its a cream phone sitting on this wood-plank desk now, kinda tilted, with fake tape at the top like i stuck it there. lilita one for the WebGram wordmark (its a little crooked on purpose) and patrick hand for the rest so it doesnt look like a chrome theme from 2014. story rings have that rainbowish border. theres a sticker that says “new tab :D” and another that says “not ig” because people keep thinking im cloning instagram lol +_+

opened it locally and it actually looks like something now. you can still click the rings and type in search. feed is still “feed goes here. not yet.” clock still says --:--. next i make the clock tick and the stories actually open google / youtube / github / etc.anyway. it looks like a desk. im happy about that :p

devlog #1

started webgram :)

ok so i open a new tab like a hundred times a day and chrome just gives me that empty search page. got bored of it. making my own for the challenge.

idea is instagram but for a new tab. not a clone, i just stole the layout because my brain already knows where stuff is. stories on top, feed in the middle, little nav at the bottom. the stories arent even stories tho. theyre shortcut buttons for google / youtube / github / discord / stardance. the feed is supposed to be live bluesky later so when i open a tab im actually scrolling something, not staring at widgets +_+

rn it was just html. like, only html. clock says --:-- like its buffering forever. search box is there but it doesnt search yet. feed is a placeholder that says “feed goes here. not yet.” opened it in the browser and it looks so unfinished its kinda funny. no colors, no fonts, just default browser stuff. clicked around anyway. story buttons work, i typed in the search, Saved in the nav jumped to #saved. vscode kept auto-closing my tags while i was writing index.html and the file looked so cooked. had to type the whole thing again. it loads now tho :p

next i make it look like a phone on a messy desk. then the feed gets real posts. anyway thats the start.