All aboard!

Hack Clubbers focus on one thing: shipping.

After building a project, like an app or website, “shipping” is publishing & sharing it online.

Your first ship your first day.

Students in many traditional computer science classes are lucky to make a single project. At Hack Clubs, every member makes & ships their first website their very first meeting.

Keeping your eyes on the prize.

Instead of learning programming concepts in isolation, learning by shipping means you focus on what you need to build real projects. It’s more fun & leads to better learning.

Recently shipped…

sampoder
@sampoder

shipped this!

screenshot_2021-01-17_at_11.31.06_pm.png
fayd
@fayd

I hope its ship-worthy, but this is what I was working hard on in 2020! My workshops! :)

image.png
sampoder
@sampoder

continuing the theme of making things for innovation week: we’re making a QR code garden in the school staircase! it’s going to be full of qr codes to hopefully make people intrigued when you scan the qr code, you’ll either get a quiz (where you can win house points!), a link to an instagram filter, an emoji guessing game, a meme, a riddle or a riddle (forked from lachlan’s SoM ideas page)! here are some samples: quiz: qr.innovweek.co/recZjRgVX47M5YwVk meme: qr.innovweek.co/recztiUqFypN6kZAP idea: qr.innovweek.co/recnTiaNAdwD9Pjc7 i’m especially proud of the quiz one. it was my first time using cookies (which ngl are super cool) and basically it creates a cookie so you can only redeem the house points once! uses next.js + airtable (but you probs already guessed that!) also geopattern is really cool, each page has a unique bg! oh and one more thing: if you are super super lucky you win a free :github: t-shirt :flying_money_with_wings:

screenshot_2021-01-05_at_8.55.43_pm.png
screenshot_2021-01-05_at_8.56.21_pm.png
sampoder
@sampoder

This Christmas I got a Jedi Challenges AR Headset from Santa (thanks Santa!). I really like the game, but I wanted to be able to put custom applications on to it! So I made Holocron :jediparrot: which is a React component that makes doing so super duper easy. It helps you size the window correctly and position the screen etc. It was my first time making a React component and I found the publishing quite difficult but I worked it out well: www.npmjs.com/package/@sampoder/holocron I then built a demo app that shows the status of your Vercel deployments on your headset. It uses SWR and react-reveal to make it feel buttery smooth! I also built one that implements the Slack events component on the Hack Club Website (here) on to it (sadly I ran out of time to put this in the demo vid but there are pics attached! Here's the GitHub project for the package: github.com/sampoder/holocron. And here's the demo video which I submitted to MLH's weekly hackathon...... and guess what?? Somehow, I won Best Overall Hardware Hack so I now get a free kit from ironically DigiKey (you still owe me money, no escaping) but my react component won best hardware hack lol!

screenshot_2020-12-28_at_2.02.57_am.png
screenshot_2020-12-28_at_2.03.10_am.png
rishi
@rishi

Helloooo Hack Clubbers! It’s ya boi rice back at it again with another HN ship :hn: :parrot:! Before I lay out the new changes, I just wanted to thank the wonderful @caleb for testing out the bot authentication system yesterday (the UNO bot looks great), and @khushraj.rathod for volunteering to build out the exchange system—forex is coming to Hack Club, everyone :parrot_love:! Anyways, let’s get back to day 4 of my personal lil shipathon: changes to @undefined and the HN API! The Teller now has one awesome new command for validating payments (/pay was there before, but I’ve added some new messages and interactivity with it), and a super great new dashboard—feel free to head over to Home on @undefined’s profile page to take a look. The HN GraphQL API now supports advanced pagination and sorting! You can now query for as many transactions as you want, iterate through them, skip through tests, and even order by different fields! For instance, to grab the 5 people with the most HN and two of their largest payments, you can do something like:

query Users {
  users(options:{
    sort:{
      field:"balance",
      order:"DESC"
    },
    take:5
  }) {
    id
    balance
  	outgoingTransactions(options:{
      sort:{
        order:"DESC",
        field:"balance"
      },
      take:2
    }) {
      id
      balance
      from {
        id
      }
      to {
        id
      }
    }
  }
}
I’m soooooo excited for what all of yall are going to be doing with this—as always, if you’re interested in making a bot, feel free to DM me with the bot’s username to get your very own token! You can find the source for HN over at: :githubparrot: 🌟 z.rishi.cx/g/hn, and the Teller over at z.rishi.cx/g/teller :D P.S. The next ship will be V1 of HN—the production-ready, stable version of the API with documentation!

screen_shot_2020-12-25_at_3.14.50_pm.png
rishi
@rishi

Yellow hellow everyone! It’s the first day of winter break, and now that all my school stuff’s finished (having handed in what might, in hindsight, have been one of the worst essays of my life), I’ve found myself quite pretty bored! I’m going to be challenging myself to build one cool thing every day (and maybe ship it either here or in #rishi if it’s smaller), so here’s the first one! I’ve found myself working with asynchronous hooks in React a lot; whether that be to fetch data or just do timed stuff client-side, the normal integrations just don’t really cut it for me. That’s why I built my own library for those kinds of hooks! @rishiosaur/async is built in Typescript, and has some awesome documentation as a result (Typedoc really comin thru), and has two hooks that I use a lot in my daily React life: usePromiseEffect and useAsyncEffect, both of which are modelled to look like idiomatic React (I’ve attached an example of their usage down below). :githubparrot: You can find the Github repo over at z.rishi.cx/g/async (feel free to star!), :npm: The NPM package over at www.npmjs.com/package/@rishiosaur/async, 🏗️ And the documentation over at async.rishi.cx!

screen_shot_2020-12-22_at_10.27.16_am.png
safin.singh
@safin.singh

Rewrote my GPT parser thingy implementation! I got rid of a bunch of useless dependencies that I could manually implement and it now contains zero unsafe code! The table-generating code has been rewritten to be way simpler and requires less allocations and stuff. I've also included comments in a bunch of places in case y'all are curious what certain lines do. Code is on GitHub and you can install it (assuming you have cargo) with cargo install gptinfo!

image.png
uanirudhx
@uanirudhx

learning next.js in prep for a ship 👀

image.png
sampoder
@sampoder

i made a thing a few weeks ago with my :hardware: that i never shared… it’s a sound reactive necklace for school! i made it in one night after my product completely fell apart so i was very fortunate to have saved it :))) code is @ gist.github.com/sampoder/374fc57a01a08514f3946c02c1cec5fc as a demo you can check out my video review of the product functionality i submitted:

screenshot_2020-12-08_at_11.53.51_pm.png
sampoder
@sampoder

i made a newsletter for the new school magazine launching tomorrow! i used next.js, mdx and deployed on vercel! been a bit stressful putting it all together but proud of the end result: vantage-point.online :yay:

screenshot_2020-12-07_at_11.55.29_pm.png
sampoder
@sampoder

ultra random ship… but my student council pulled off one of the biggest events of the year super last minute! we wanted to raise money for movember :moustache-parrot:, but caught up with stuff, in the end we did a 🥧 pie the teacher event! we had 10 or so teachers + me and the vice president of stuco who were forced into this by some very ~evil~ creative stuco members loll, it was painful but i individually raised like 50 bucks so thats cool… overall, it actually went super well and mostly smooth and we raised like A LOT of money: $529.85 💸 i looked like the abonimal snowman at the end apparently

gwa00163.jpg
gwa00146.jpg
gwa00071.jpg
sarthak
@sarthak

🚢 CHALLENGE SHIP 🚢 Aight I’m shipping a link shortener which is faster than @rishi’s if I remove the Airtable integration. Like @rishi’s, it supports additional parameters at the end of a link. It’s written in Next.js and just as easy to clone. Check it out at srtk.me/gh/srtk.me-v2! (that link is using the shortener) coming soon: ip address tracking with location and other information

image_from_ios.png
linus
@linus

Installer package is complete, now I'm just waiting that special installer certificate, then I can ship! 🚢

screen_shot_2020-11-24_at_9.14.46_pm.png
sarthak
@sarthak

YEEHAWWWW 🤠 today i added a walkthrough page for my site cause my main page is super simple. My favorite parts are the custom card components I made and the timeline I made! Check it out at sarthakmohanty.me/walkthrough!

image_from_ios.png
image_from_ios.png
sampoder
@sampoder

i worked out how to gain access to the image feeds of major traffic cameras around the island and built a dashboard for snooping around looking at each one: sg-traffic.now.sh….. these images are cool to watch over time, I might make something tomorrow for generating time-lapses from them :D source @ github.com/sampoder/traffic-monitor …. I used next.js, who would have guessed?

screenshot_2020-11-22_at_11.28.47_pm.png
matthewvandyke08
@matthewvandyke08

Just posted my first Note/Update about SWC, (this one being my thoughts about the new redesign of SWC I'm working on) on my portfolio! matthewv.me/swcnotes

image.png
cwi
@cwi

Today/yesterday I release my first installable python app: nought. It organizes all of your files in custom ways that you define. For example, sort all your screenshots into folders by month. It includes powerful options and is super customizable. If you have any questions/find any bugs. Please submit an issue or PR! github.com/cole-wilson/nought

screenshot_2020-11-16_at_7.12.41_pm.png
sampoder
@sampoder

this has been floating around the slack last night but let me introduce you to <https://meet.hackclub.dev|meet.hackclub.dev>! it's a fun website that introduces you to a random Hack Clubber from the Scrapbook API. I made it a while back with Next.js :)

screenshot_2020-11-17_at_9.11.37_am.png
sarthak
@sarthak

shipped my first next.js website! I’m so ecstatic! srtk.me

image_from_ios.png
sampoder
@sampoder

Scrappy now supports webhooks! so when ever you post something it will send a blank fetch request to any url you set... you can set that url using /scrappy setwebhook <https://example.com> I built a little demo app that adds my Scrapbook posts to my Github profile README (check out the image below) you can see it at github.com/sampoder/readme-scrapbook and make your own with hack.af/readme-scrapbook hope you all can automate cool things!!

screenshot_2020-11-12_at_8.41.21_pm.png
ben
@ben

Got a research paper accepted into a conference!!!

screen_shot_2020-11-11_at_1.17.45_pm.png
sampoder
@sampoder

I edited a musical!! you can watch it at oneness.now.sh... it's for language and culture week at my school and called the Oneness play. It was a massive challenge.. as we ran into A LOT of issues filming it but im pretty proud of the end result tho a few thing things im not super fond of ya check it out if youd like: oneness.now.sh :)

screenshot_2020-11-12_at_1.43.10_am.png
malte
@malte

turns out i should ship some other stuff I drew the last week! Enjoy, based on WW2 propanganda.

image_from_ios.png
malte
@malte

'Shadow on the wall' Drawn by me, digital, 2020

image_from_ios.png

These are just a few posts…

Keep exploring →

Want to ship your own projects?

The #ship channel on the Hack Club Slack is where 10k+ teenagers from around the world share what they’re working on & help each other.
Join our Slack