Vercel Posts – Hack Club Scrapbook

Posts tagged with :vercel:

🇨🇦 Hack The North 2023! @ImDeet-U045B4BQ2T0, @fayd and I teamed up to make :goose-dance: Hack The Geese :goose-honk-left:! It was a game that attendees could play using the QR codes on their badges. Here’s how’d it work: 1. You’d scan your badge’s QR code to log in. 2. Your find someone who you’d like to compete against and scan their badge’s QR code. 3. You’d both receive a prompt, eg. “take a selfie with a someone with blue hair”. 4. You’d race to take a fun picture based on the prompt before the other player does. 5. You either win or lose, then you got to choose wether or not to rematch! You can go to htgeese.tech/album to see all the photos that folks took during demos with the game (and many more of me stressing over the backend)! We used a slightly cursed combination of a Next.js frontend and a backend written in Go which interacted with one another through Websockets…. yeah, very cursed and very jank. We also used Vercel’s new Postgres & Blob storage services which were surprisingly good. And, of course, we used Prisma…. including it’s slightly hacky spin-off Go client. Another awesome part of the game was @ImDeet-U045B4BQ2T0’s custom designed geese (GEESE!): :htn-goose-1: :htn-goose-2: :htn-goose-3: :htn-goose-4: :htn-goose-5: :htn-goose-6: :htn-goose-7: :htn-goose-8: :htn-goose-9: :htn-goose-10: Every player got one of these made for them when they first signed! The game was a bunch of fun to play IRL and we had people playing it throughout the demo session. Attached is a sick selfie of @fayd in his sunnies and the judge! And at the end of the day, somehow, we were selected as winners so we got to demo on stage and won a couple of prizes which was pretty cool! Here’s us playing a game with all the attendees and a couple of other photos from the weekend (including us working on the project while on #hack-night!). The GitHub is full of more photos and stories from the weekend: github.com/sampoder/hack-the-geese. O CANADA!

https://scrapbook-into-the-redwoods.s3.amazonaws.com/cf2b0eb5-4b92-4c06-b2aa-78cf8f83342e-68747470733a2f2f636c6f75642d3677737063706132732d6861636b2d636c75622d626f742e76657263656c2e6170702f3070726f6d70742d302e393935333738393433393239363533322e706e67.png

https://scrapbook-into-the-redwoods.s3.amazonaws.com/2f66fef0-8448-486c-be64-62d76829d73b-268510329-08ca52f3-2170-453e-b223-0abe5576a1d4.jpg

https://scrapbook-into-the-redwoods.s3.amazonaws.com/f4cfcc99-9382-4421-a683-adbf54bf5d35-268510412-4a7e75e7-e510-48f7-bf8e-38f493a24f4c.png

https://scrapbook-into-the-redwoods.s3.amazonaws.com/880621d2-d658-4bdc-8769-7cf5c80e4be4-268509113-916408e1-8e21-4487-9c4c-2dd77e81515b.png

https://scrapbook-into-the-redwoods.s3.amazonaws.com/f34e634d-a7b3-4b96-b381-aef9f5afb17c-68747470733a2f2f636c6f75642d38626e6877713064682d6861636b2d636c75622d626f742e76657263656c2e6170702f3073637265656e73686f745f323032332d30392d31375f61745f372e34382e34355f616d2e706e67.png

https://scrapbook-into-the-redwoods.s3.amazonaws.com/b08d5e1f-f330-4c45-bcd1-6ae51255a6ba-268523676-2aaf42d3-3d4c-4a93-bea4-4c6b212b3905.jpg

https://scrapbook-into-the-redwoods.s3.amazonaws.com/49062a69-7d85-4924-99f0-a56aae1619b7-68747470733a2f2f636c6f75642d38626e6877713064682d6861636b2d636c75622d626f742e76657263656c2e6170702f3173637265656e73686f745f323032332d30392d31375f61745f372e34392e30335f616d2e706e67.png

https://scrapbook-into-the-redwoods.s3.amazonaws.com/a22cced9-0970-40fd-9700-a106aff68745-screenshot_2023-09-17_at_6.13.58_pm.png

Wahoo! Today I learned how to use :vite: and I moved my github.com/jzaleta/night-skies project to use it! It was very fun to implement ES modules and to find janky :jankman: ways to add P5.js to it. :peefest: You can check the result site at night-skies.vercel.app like last time and star it ⭐ on GitHub if you want :) I still need to find a way to properly add meta tags so my index.html isn't very big but anyways this was nice to hack on.

https://scrapbook-into-the-redwoods.s3.amazonaws.com/3598f7df-58be-4521-a0fe-d2d1c6699a75-screenshot_2023-07-13_at_18.29.10.png

After spending more than 3 hours and 20+ deployments, I have finally mastered temporary storage on Vercel! :roo-love:

https://scrapbook-into-the-redwoods.s3.amazonaws.com/3d39709e-90e3-487f-ad20-b4fe62881874-scr-20230704-uhlp.png

Next.js depends on my software now github.com/vercel/next.js/issues?q=is:issue+is:open+sort:updated-desc+label:linear (I created the linear to github syncing system they use, any issue with [NEXT-...] depends on code I've written)

https://scrapbook-into-the-redwoods.s3.amazonaws.com/13b74262-ed9e-45d3-b436-b850a9f09b27-lxz2m0vsbfw8jtxv_2x.png

Making Club Directory more responsive for mobile (check it out @ clubsdirectory.vercel.app) (also included a screenshot what it looked like before)

https://scrapbook-into-the-redwoods.s3.amazonaws.com/58cbe40e-1afb-4c44-8201-aaba97cfa5ec-screenshot_2023-05-09_at_3.04.55_pm.png

It's been a loooog time since I saw www.dinosaurbbq.org :dino-dance:, so I decided to make a ship based on it! 🚢 I made github.com/j-cordz/peace-and-tranquility, a website inspired and based on @msw project, with some new features like a 📀 eject page! Go star it ⭐ on :github: and check it at: peace-and-tranquility.vercel.app/index.html :dino:

https://scrapbook-into-the-redwoods.s3.amazonaws.com/896ce1c0-d669-4c87-87b6-eed075811b40-dancin.png

*It’s a quiet night... the weather forecast says:* 🌌 Starry-sprinkled night skies with a chance of shooting stars and Lo-fi beats. You say to yourself, wait, that can’t be possible, right? Definitely possible! I present y'all my new ship: night-skies.vercel.app 🚢 :quad_parrot: Night skies github.com/j-cordz/night-skies is a small p5.js :js: website that includes a starry night sky and random shooting stars and some lo-fi beats! 🎵 Please give it a ⭐ on :github: if you like it! This was very fun to work on, and helped me to learn more about p5js.

https://scrapbook-into-the-redwoods.s3.amazonaws.com/1d7be104-7d40-41c7-9029-5110e6b3fcfd-captura_de_pantalla_2023-04-30_a_la_s__10.37.24.png

https://scrapbook-into-the-redwoods.s3.amazonaws.com/e8d39d58-f6d2-4051-8c71-81e76d4711ec-captura_de_pantalla_2023-04-30_a_la_s__10.37.09.png

:vercel:

https://scrapbook-into-the-redwoods.s3.amazonaws.com/165466ef-a614-4480-aa34-e8bce1481279-captura_de_pantalla_2023-04-22_a_la_s__23.52.28.png

Shipped the uil study tool on Vercel today at uil-study-tool.vercel.app (Github at github.com/Sarthak-Dayal/uil-study-tool)! There are still some optimizations I can potentially make to the model, but it works well for my current intended purpose of making my daily science UIL studying more fun. Also, began part 2 of the fast.ai course today so I can potentially build up to making an AI image upscaler to dive deeper into AI as I improve the quality of some of my profile pictures.

https://scrapbook-into-the-redwoods.s3.amazonaws.com/8be5b71a-ce4a-4e24-adeb-56c2776b2ee4-image.png

This begins my side quest of getting Vercel swag... :vercel:

https://scrapbook-into-the-redwoods.s3.amazonaws.com/10bd3269-a7a0-4da5-90a1-0ff2060a42d8-screenshot_2023-04-03_at_8.13.17_pm.png

WHW! Fixed the 500 error on gramophone-502x.vercel.app/api/currently that Toby spotted :D

https://cloud-rh8q1t91s-hack-club-bot.vercel.app/0image__3_.png

Used Vercel’s @og-image package to generate images for the currently playing song that I can then display on the PyPortal (once I get it working). Try it out: gramophone-502x.vercel.app/api/currently!

https://cloud-ks3hkmmwx-hack-club-bot.vercel.app/0image__1_.png

https://cloud-qsidvv89t-hack-club-bot.vercel.app/0image__2_.png

Got some swag from Vercel!!!!!

https://cloud-ocwzeqqvt-hack-club-bot.vercel.app/0img_1976.jpg

https://cloud-5rpycznab-hack-club-bot.vercel.app/0img_1974.jpg

#w-of-the-day day 21 today was a good day, did some major work on winterlings and chatted a lot in #hack-night (ya'll should join too), also may have commit spammed the hc winter repo trying to fix markdown files :p just gotta finish the pop-up modal and i'm ready to sail this thing to the seas :D

https://cloud-i3tphrkil-hack-club-bot.vercel.app/0image.png

Today I selected the Dalle-2 images I'll use for the profile picture workshop! I generated them with the app some time ago. I also finished a V1 version of the code, but it stopped working because some errors on the package.json file :npm: . Also I made my own .gitignore file for this project!

https://cloud-l6y7d1002-hack-club-bot.vercel.app/0exploration-cabin.png

https://cloud-2y2fpa3kn-hack-club-bot.vercel.app/0forest-astronaut.png

https://cloud-ez9snnzl2-hack-club-bot.vercel.app/0grassland-robot.png

Working on getting conflict to support Vercel

https://cloud-no9teffvg-hack-club-bot.vercel.app/0image.png

#w-of-the-day day 9 but not really cause SCHOOOOOOL!!! :blob_sad: not much happened cause, you know, SCHOOL did some extra work on winterlings and did some coding problems cause why not i'm gonna have to decide whether i'm taking part in #hardware-party or not, doesn't help since apparently my finals will begin at the same period of building the items :confuse:

https://cloud-6mjzlrcfz-hack-club-bot.vercel.app/0image.png

Presenting my latest project, Decarbonize: The Game! It’s an interactive game with laser-cut pieces & iPad/Next.js software. You’re in control of the electric grid for 50 years: build out solar, wind, natural gas, & goal to explore the effects on carbon emissions & energy prices. Thanks @matthew for filming.

day 8 of #10-days-in-public! i built and deployed the first version of my personal website which was built with next.js and tailwind css today using vercel! still need to fix up the meta data, but so happy everything is coming together!

https://cloud-himfayigo-hack-club-bot.vercel.app/0image.png

Yo, it's been a minute. Been busy with some school stuff, made this quick website for one of my government class projects. We had to research supreme court cases our teacher gave us. (I got Mapp v. Ohio) mappvohio.vercel.app/posts/mappVOhio here's a screenshot 🤠

https://cloud-72otrxds8-hack-club-bot.vercel.app/0image.png

Day 3 of #10-days-in-public! Added some images to fill up the empty space; I think it looks better now :partyparrot:. Next step will be making it responsive… Check out what I currently have 👉 lelandcs-v2.vercel.app

https://cloud-5feg36jim-hack-club-bot.vercel.app/0image.png

Thanks vercel!!! (For context: I got Vercel to send me a bunch of swag to hand out at :hackaustin-green-icon: !)

https://cloud-iu357dtmj-hack-club-bot.vercel.app/0img_2628.jpg

today, for my project i set up nextra.vercel.app for the documentation (github.com/substore/docs), and i setup a few GitHub workflows for our repo (really just linting/testing). i also got a logo designed recently for this project (not made from me though). day 1 #10-days-in-public

https://cloud-52x2mxwgm-hack-club-bot.vercel.app/0substore.png

working on something… :vercel: :partyparrot:

thanks vercel!!

https://cloud-7cxbpto6v-hack-club-bot.vercel.app/0image.png

Deployed :vercel: another Hack Club :hack-club: workshop! This was very interesting to work on.

https://cloud-he04kwp3k-hack-club-bot.vercel.app/0captura_de_pantalla_2022-09-17_a_la_s__20.08.36.png

even copilot knows that we’re giving vercel hats to all winners (and :vercel: :nextjs: :svelte: stickers for everyone!!)

https://cloud-1v53xi4uf-hack-club-bot.vercel.app/0img_20220913_154415376.jpg

https://cloud-8aw8f1qal-hack-club-bot.vercel.app/0image.png

https://cloud-kmtps02nw-hack-club-bot.vercel.app/0img_20220913_154153406.jpg

Today I learned more about Nix :nix: thanks to @tejasag! I have a better understanding now about nixOS, nixpkgs 🗃️ home-manager 🏡 nix-darwin 🐠 and other things! I have a better idea too on how this kind of dotfiles works.:parrot-nix: As well I'm finally working on my website again! I never finished last design so this is going to count towards my first version! 🌐 Also yesterday I managed to de-cypher 🔓 and enter Hack Club :hack-club: 2022 summer event :tw_bridge_at_night: website! It was so much fun and a very interesting project! I learn a lot of things from this like OpenSSL! :cat-on-the-laptop: :tw_unlock:Lastly, somehow I saw Vercel's 404 :sadmac: page for the first time while checking my projects dashboard. :vercel: :sphere:

https://cloud-dymbgd9w3-hack-club-bot.vercel.app/0captura_de_pantalla_2022-06-17_a_la_s__23.58.25.png

https://cloud-7kanur96d-hack-club-bot.vercel.app/0captura_de_pantalla_2022-06-17_a_la_s__23.59.08.png

https://cloud-esvnj18bl-hack-club-bot.vercel.app/0nixos.png

Today I learned more on how to work with VScode! :vsc: I didn't knew :thinking: it was possible to open a terminal :macintosh-stcicker: on it! I tried as well to open the neofetch command and Vim :vim: on it and my Splatter Paint 🎨 project files! Today I also worked again on details for two new Hack Club :hack-club: PR! :pr: The first one is to add Scrapbook to the GitHub :github: README and the second is my Workshop translation guide! :mexicoparrot: All of this are from ideas talked with @jessicard yesterday, thanks a lot for guiding me and reviewing my work! :yay: Lastly for today, I kept studying for my Biology Exam! 🦠 🔬

https://cloud-82syjxkzn-hack-club-bot.vercel.app/0vscode.png

you can now deploy conflict to vercel! :conflict: :vercel: only issue is that you just get this generic debug response

https://cloud-2jltuj4gr-hack-club-bot.vercel.app/0image.png

My Discord bot framework :conflict: will soon support deploying bots to :vercel: Vercel!

https://cloud-9gz5qktkq-hack-club-bot.vercel.app/0image.png

Today I worked on my next workshop: Acoustic Galaxy! 🌌 🌆 This is a project that comes from Hack Club's :hack-club: P5.js :javascript: Sound 🔉 Visualizer by @matthew! Thanks for all the help! :quad_parrot: It's very cool, I learned many awesome coding things and I debugged too 🐛 :dino-debugging: , as well I deployed the project to Vercel! :vercel: acousticgalaxy.vercel.app. And here's the repo! :github: :pullrequest: github.com/J-cordz/Acoustic-Galaxy :parrotdad:

https://cloud-1kepcculp-hack-club-bot.vercel.app/0acoustic-galaxy.png

https://cloud-vga4s3v4b-hack-club-bot.vercel.app/0captura_de_pantalla_2022-05-12_a_la_s__22.40.11.png

https://cloud-8cckrxovo-hack-club-bot.vercel.app/0acoustic-galaxy-deploy.png

FIRST SHIP EVER!!! 🚢 :quad_parrot: 🎉 Hello everyone, today I can finally and very happily say that I have made my first ship! And not just one, but 2 in 1! 🥇 So let's get started! :parrotdad: The first thing I'm shipping right now is my Splatter Paint 🎨 project made with Paper.js :javascript: This is a HTML Canvas which lets the user draw circles with different sizes and colors and a linear path 🖊️ as well. My code is hosted on my GitHub Account :github: and it's deployed using Vercel! :vercel: This is as well the first project on which I use it, and I must say it's very cool to use! Thanks to all of this, I can say that this project helped me to understand better how JavaScript works, how to write awesome :cooll-dino: READMEs and how to deploy with Vercel. 🗃️ So the second thing I did is a great CSS :css: Customization to my #scrapbook :hack-club: profile! (This is also the first time I'm posting to it outside of the channel itself). I did it a few days ago as you can see it on my Scrapbook posts, but I was told to ship this as well! This features a custom background with a texture, gradients, the application of elements like :before and :after , some cool borders and a great animation! From this I learned how to get better at design and with CSS. To all of this I'm attaching some pictures 📸 of the projects and the links! 🔗 🌐 github.com/J-cordz/Splatter-Paint :github: splatterpaint.vercel.app 🔗 gist.github.com/J-cordz/e9d92b3b5cba0e35ed6ec830d1a2b0b2 :github: That's all for today, feel free to ⭐ any of the projects or follow me if you like and see y'all later with the next Ship!! Wahoo!

https://cloud-f5hk0hox0-hack-club-bot.vercel.app/0vercel-deploy.png

https://cloud-i3iajvxkk-hack-club-bot.vercel.app/0splatter-paint-readme.png

https://cloud-ai2m0ds91-hack-club-bot.vercel.app/0captura_de_pantalla_2022-05-08_a_la_s__16.39.21.png

https://cloud-krww35t2z-hack-club-bot.vercel.app/0final-canvas.png

Today I added a small new thing to Splatter Paint! 🎨 As well I had some cool :cooll-dino: :blob-cool: conversations on the slack :slack: like every day :D this time about plants with @ced and others! Here's some pictures of the evening 🌆. Also I downloaded LDtk, which is a 2D Level Design Toolkit! 🎮 I'm also working on a ASCII project about frogs/amphibians. 🐸 Sadly :sadge: I still couldn't went to the movies 🍿 to watch Dr. Strange :drstrange: so I'll have to wait more and my ISP is now blocking Vercel :vercel: even with 1.1.1.1 and others DNS Providers I tried, so I will be setting up a project of my own to try to solve this and as well use @BenjaminSmith server with Outline VPN! 🌐 :wireguard:

https://cloud-8hv3mpt7g-hack-club-bot.vercel.app/0sansevieria-plant.jpg

https://cloud-nj5ls8gst-hack-club-bot.vercel.app/0outline.png

https://cloud-755pbuv5t-hack-club-bot.vercel.app/0img_20220507_195804.jpg

https://cloud-qixtv885i-hack-club-bot.vercel.app/0img_20220507_195607.jpg

https://cloud-j3ze5rm5x-hack-club-bot.vercel.app/0screenshot_20220507_225337.jpg

https://cloud-dp7x5vs6v-hack-club-bot.vercel.app/0img_20220507_195529.jpg

https://cloud-doudn6d2j-hack-club-bot.vercel.app/0img_20220507_203433.jpg

https://cloud-gpnz9b51k-hack-club-bot.vercel.app/0img_20220507_195507.jpg

I'm in the process of trying to learn Autodesk Inventor so I can design and print my own 3D parts for projects. Been looking for tutorials to follow online, and found this PDF. Completed the first challenge in it tonight! I'd like to figure out how to make the design process more elegant. I kept getting tripped up on trying to center lines using constraints, which I didn't see a button in Inventor for. My sketches are really messy for this, but I'm happy my final result at least looks like what it's supposed to!

My ISP 🌐 is still blocking Vercel :vercel: hosted websites, which means I can't access my Dashboard 💻 or anything else, so to solve this I learned more about DNS and did a setup with 1.1.1.1 ! It worked amazing. :quad_parrot: This is a DNS Service by Cloudflare :cloudflare: that helps to avoid this kind of issues. As well I learned more about VPN protocols, cloud ☁️ :cloud-thoughts-head-full: based VM's and web sockets! 🕸️ Lastly, here's a picture of how my Scrapbook :hack-club: with the new CSS :css: looks now on a computer! :macbook-air-space-gray-screen:

https://cloud-j1904gq2z-hack-club-bot.vercel.app/0captura_de_pantalla_2022-05-02_a_la_s__22.09.44.png

https://cloud-bnpf67m3w-hack-club-bot.vercel.app/0captura_de_pantalla_2022-05-02_a_la_s__22.07.54.png

https://cloud-h28lhzr18-hack-club-bot.vercel.app/0captura_de_pantalla_2022-05-02_a_la_s__22.08.38.png

Here's what I was talking about on my previous time! And it's that I deployed a project for the first time, and I decided to do it with Vercel! :vercel: It's so fast and easy to setup, this is my Paper.js :javascript: canvas, now available both on my GitHub :github: github.com/J-cordz/Splatter-Paint and on it's own website! 🕸️ splatter-paint.vercel.app, next step with this is to add more information to the README and then move to the next :hack-club: workshop! This was useful to understand better how to properly setup a project and have a fun time with code! 💻

https://cloud-bds9spcwn-hack-club-bot.vercel.app/0captura_de_pantalla_2022-04-20_a_la_s__22.23.21.png

https://cloud-7iit9vsb2-hack-club-bot.vercel.app/0vercel-deploy.png

Cloned @sarthak Perfect files on GitHub, and worked on a site using Vercel/NextJS. Thanks @abby for the slideshow tutorial!

https://cloud-cugmrid25-hack-club-bot.vercel.app/0screen_shot_2022-04-07_at_1.16.51_pm.png

This week I’m going to an FRC competition and going to be leading my old team’s scouting. I made a link tree for quick links. I know the links don’t fully work as I haven’t finished making the forms. I followed Steph.js’s tutorial! Here’s the link: cada2022-link.vercel.app!

https://cloud-augedumiz-hack-club-bot.vercel.app/0screen_shot_2022-03-21_at_7.26.11_pm.png

:conflict: Working more on the website! conflict-website-v2.vercel.app Today I did some more stuff with eslint and next.js which is cool. I also learned that the alt text of an image gets copied when you select it with other text.

https://cloud-9u5lqvaze-hack-club-bot.vercel.app/0image.png

Finished my weekly coding project and deployed it on vercel

https://cloud-n4qobt1fx-hack-club-bot.vercel.app/0screen_shot_2022-02-26_at_6.52.55_am.png

Finished all major functionality of my Material You-inspired dashboard for my work! Super happy with the results. It's built in Vue 3/Vite and uses a MySQL server for the database. DB connections are managed with Vercel Serverless functions. This screenshot shows the admin panel (in light mode) where you can add and edit sites. Open-source, of course: github.com/micahlt/epicdash

https://cloud-5ibx76l8u-hack-club-bot.vercel.app/0image.png

Working on my url shortening service! Starting with Nextjs 12's new Edge functions and redis, but plan to go even further and try to make it distributed highly scalable with no collision guaranteed! PS. I don't know which domain to use, lmk if ya have a short url and can lend a subdomain xD

https://cloud-mudwlkkhg-hack-club-bot.vercel.app/0image.png

Since vercel removed its 50 domain limit for pro accounts and also has a new api endpoint for delegating subdomains, I made a bunch of pull requests to try to make vercel managed custom domains work for scrapbook! So now if you run /scrappy-setdomain, you should be able to set a custom domain, even if the domain is managed by vercel :yay:

https://cloud-20ytvfhzu-hack-club-bot.vercel.app/0screen_shot_2022-01-28_at_9.40.54_pm.png

Today I successfully finished my Facebook post mass deletion webapp (written in Vue 3 and Vercel serverless functions) for work! It makes managing multiple business pages much easier than the official Facebook Business Manager does.

https://cloud-5mue5lbuw-hack-club-bot.vercel.app/0image.png

Here's my code in the dark submission (citd.vercel.app). tried to recreate hackclub.com/slack in 30 mins xD. It was really fun, didn't know I could still write vanilla html css, and speed coding is nice.

https://cloud-xfgmyxe4k-hack-club-bot.vercel.app/0image.png

Today I joined a Hack Club event! Although I didn't had the opportunity to stay the full event, it was a nice experience, recently I also setup up my Vercel Account :vercel: for hosting my open source projects but I forgot to mention it before!

https://cloud-p3hs83n2o-hack-club-bot.vercel.app/0captura_de_pantalla_2022-01-09_a_la_s__11.55.21_p.m..png

since i shipped the purdue hackers events site last month, it has lived without any social cards. today i forked vercel/og-image and adapted it for purdue hackers! now every event has a dynamic social card and we can easily create more for other parts of our website :partyparrot: og.purduehackers.com

https://cloud-gxdmohtho-hack-club-bot.vercel.app/0screen_shot_2021-12-26_at_11.25.43_pm.png