Skip to content

Instantly share code, notes, and snippets.

@takapiro99
Last active December 13, 2024 17:02
Show Gist options
  • Select an option

  • Save takapiro99/5598b0f5c730e47d4b58c64c12011297 to your computer and use it in GitHub Desktop.

Select an option

Save takapiro99/5598b0f5c730e47d4b58c64c12011297 to your computer and use it in GitHub Desktop.
制作物やイベント参加記録

作ったものなどをまとめるページ

⭐ ブログ → githubio

Twitter → @takapiro_99
GitHub → @takapiro99

LT など登壇資料まとめ → https://drive.google.com/drive/folders/1JLm3j1...

まえがき

The newer, the better だと思っていましたが、そうでもないかもしれません

資格

  • 応用情報技術者: 2021 春

〜制作物たち〜

早押し!宇宙人からのシグナルクイズ @CraftStadium(2024/09)

React, Express, TypeScript, Socket.io

image

「ジェスチャー当ての、みんはや」

  • 「その場が盛り上がるプロダクト」というテーマのハッカソンで製作。2 位を獲得 ✌️
  • 担当:会社の同僚の、エンジニア+デザイナーの 3 人で出場。実装全般を担当。
  • メモ
  • 感想:また徹夜をしました…。自分史上最速の開発速度で、成長を感じました。

Hokkaidle @個人開発(2023/07)

React

image

「北海道 179 市町村の形当てゲーム」

  • 担当:全部
  • メモ
    • https://hokkaidle.web.app/ Try it!
    • Wordle のパロディの Worldle のパロディ。
    • Worldle を見つけてからずっと作りたくて、1 年半越しに作れた。
  • 感想:Twitter で #Hokkaidle でつぶやいてくれる人がたくさんいて嬉しいです。

VTuber 音声合成 @友達と開発(2023/07)

VITS, Cloud Run, FastAPI

image

「VTuber の声で任意の文章の音声を作れる」

  • 友達と 2 人で趣味開発。1 泊 3 日の泊まり込み合宿形式で実施。
  • 担当:忘れた 多分アプリ化の部分
  • メモ
    • https://vtu-voice.web.app/ Try it!
    • なにか新しい技術を触ろうという目的でこれを作成。
    • ファインチューニングという技術を学んだ。
  • 感想:最新技術はすごいな…と思った。

シーソーオンライン @HackDay2022(2022/09)

React, posenet, go

image

「フレンドパークのパクリのユーザー参加型ゲーム」


  • 2022/04
    • 社会人になりました。
  • 2022/02
    • 卒業が確定して、嬉しくなる。
    • ICTSC(トラシューコンテンスト)出場に向けて、サークルで勉強会・ハンズオンを開催した(資料
    • ICTSC に参加した(ブログ
  • 2022/01
    • 卒論が完成した 🎉
    • 卒論締切が迫っているのに、サークル合宿に参加した(↓)

雪玉でガッハッハ @サークル合宿(2022/01)

React.js, Fastapi

image

「雪玉を避ける 1vs1 対戦ゲーム」

  • リンク(Heroku が有料化したため動かない)
  • サークルで開催されたハッカソン合宿で製作
  • 担当:自分と後輩 4 人チームで、フロントエンド・全般を担当
  • メモ
    • マリオパーティーの「鉄球でガッハッハ」というミニゲームのオマージュである。
  • 感想:エアビーでやったが、サッポロ冬割で豪遊した。終わってからみんなで行った布袋本店がおいしかった。

  • 2021/11
    • サッポロ冬割(ホテルめっちゃ安くなったやつ)の予約合戦のために、スクレイピングツールを作った(ブログ)(コード
  • 2021/10
    • インスタの FF チェッカーみたいなの作った(合法かどうかは知らん
    • 研究の解析とかを python でやり始めて python 便利すぎだろって思う

COCONOMASK @JPHacks2021 (2021-11)

React.js, Fastapi, raspberry pi zero

image

「COCOA の電波が近くにあったら自動で閉まるマスク」


Maple @テクのこ 2021 (2021-10)

React.js, Fastapi

image

「位置情報に基づいた、画像投稿 SNS」


BookTree @技育展 2021 (2021-09)

React.ts node.js ...

image

「人が中心の、読んだ本を共有する SNS」


ネットワーク実験くん (2021-05)

docker open vswitch VyOS

「ネットワーク実験くん」

  • 東工大 traP が開催していた 勉強会 にインスパイアされ、@huitgroup でハンズオンを主催
  • 担当:進める人
  • 資料:公開できるように調整中
  • 感想:初心者が多くてハンズオンでつまづきが多かった
  • どうしても これ のソフトウェアバージョンを見てみたいので、現在作っています
    • ブラウザでアニメーションによってレイヤーごとに可視化できる感じのもの
    • 全てのポートにミラーポートを入れるか、バカハブを挿入してから tcpdump で全て取得、加工してフロントエンドに投げたい
    • on going...

  • 2021/04
    • 無事進級ができた、あとは卒業するのみになった
    • 未踏に応募したが、落ちた
      • しかもそのアイデア Google が3年前から やってた (それをちょうどその頃公表してた(は?))(5 月の GoogleIO でも出てた)
    • サークルの新歓で LineBot のライブコーディングやってみた
  • 2021/03
    • pixiv 株式会社で2 weeks 実務インターンをやった
      • React × TS で色々 UI を実装した
      • 速攻デプロイされて "実務" を感じた
    • 自作プロトコルスタックインターンに参加した(コード
      • パケットの気持ちになれた気がした
    • 就職先が決まった
      • 東京でソフトウェアエンジニアになることになりました

ここで一句 (2021-02)

Unity, ARCore, Firebase Functions, NodeJS

image

「俳句が詠め、詠まれた場所でそれを AR で見れるアプリ」

  • https://sdgs.oeic.hokudai.ac.jp/educational-programs/spe-191/ の一環
  • 担当: 開発は二人で、サーバーサイドを担当
  • メモ
    • 田舎を IT の力で活性化しようという企画で、位置情報を活用した俳句アプリを作った。
    • Firebase Functions で画像処理したらメモリ足りなかったから金で解決した。
    • 相方の書いたブログ → https://blog.gojiteji.com/2021/02/19/unitygps/
  • 感想:作ってから、別に AR で俳句見る人なんていないんじゃないか…と感じました。


arcana @JPHacks2020 (2020-11)

Vue Fastapi ESP32

image

「重さを測ることで在庫の残量を web から確認できる IoT デバイス・ツール」

  • デモページ (ゲストでログイン)
  • ブロック投票 2 位、全国大会進出
  • 担当: みんな割となんでもできる 5 人チームで、ハードを担当
  • メモ
  • 感想: ハードも楽しかった!

  • 2020/10
    • ハッカソンに参加し続けたら圧倒的成長ができると思っていたが、実はそういう場ではなく、「持ち合わせているスキルで最短距離でプロダクトを作る」ところなのだと気付き始める
    • OS とか低レイヤーを勉強したくなる

密チェッカー @ U22 Civitech Challenge Cup (2020-10)

React flask RaspberryPi

image

「二酸化炭素濃度から密が分かるかもしれないプロダクト」

  • 今から行こうとしているところ、三密回避できていますか?
  • デモページ
  • 担当: 初対面 4 人チームで、フロントエンド全般を担当
  • メモ
  • 感想: プレゼンって大事だな

200M @ディスカバリーハッカソン (2020-09)

React, SkyWay, FaceAPI.js, RasPi, i2c, MQTT, beabotte

image

「視点を動かしたらそれに合わせて相手のカメラの位置が移動するビデオチャットアプリ」

  • よりオフラインに近い体験、窓越しに話しているかのような感覚が実現したかった
  • デモページ (console に注目)
  • 担当: みんな割となんでもできる 4 人チームで、SkyWay(ビデオチャット部分)を担当
  • メモ
    • ZOOM をもじって 200M というプロダクト名にした
    • 2 日間の中でカレー、タピオカ、寿司など楽しんだ
    • APIkey などを載せちゃったのでレポジトリは非公開
    • 発表スライド
  • 感想
    • 2 日でこんなのできるのかよ…これ大学の研究だろ…っていうのが散見されて、前準備の大切さを思い知った
    • 賞を何ももらえなくて悔しかった

ScenePicks (2020-09)

@楽天 二子玉川夏の陣 2020 (ハッカソン型インターン)

Next.js Pixi.js Golang Swagger ECS docker-compose

image

「"セリフ" のみを通して、アニメや漫画、映画をシェア・発見できるサービス」

  • 2 週間のハッカソン型インターン
  • 担当
    • フロント2人、サーバーとインフラ2人、コードを書けない PM 的な人、途中でいなくなった人というチームで、フロントエンドを担当した
  • 技術
    • 海に浮かぶワカメのようにセリフがふわふわ浮いている UI がこだわり
    • 物理演算ライブラリの Matter.js と、Canvas 描画に Pixi.js を使った
  • メモ
  • 感想
    • ご飯はしっかり食べたほうがよい
    • 触ってくれる人がどう思うかということが大事。インターフェイスが大事。
    • ハッカソンでは新しい技術に手を出さないでサクサク開発できる方が強い。
    • プレゼンで映えさせたい

(再) React ハンズオン開催した (2020-10)

  • TechStudyGroup に声をかけていただいて、↓ と同じ内容で 開催した
  • 担当: 講師
  • メモ: 20 人くらい来てくれて、13 人くらいが完成までたどり着けた
  • 感想: Comment Screen を使ってインタラクティブにわいわいできて楽しかった

React ハンズオン開催した (2020-09)

React, JavaScript


3D オセロ@サマーハッカソン (2020-08)

React, Three.js <-> socket.io, Python(flask) <-> Redis, Heroku

image

「3 次元のオセロ」


楽天トラベル API で楽天トラベル(2020-07)

@北海道大学公開講座ハッカソン

React.ts <-> Go(gin) <-> Redis, docker-compose

image

「SNS などの文章から、あなたに適した宿泊施設をおすすめするアプリ」

  • デモ動画
  • ほぼビジコンみたいなハッカソン
  • 担当: 6 人チーム(うち 3 人初心者)で、フロントエンド統括とバックエンドの認証部分を担当
  • メモ
    • 発表スライド
    • 1.5 日間真剣に話し合ってアイデアを捻出した
    • 「アプリ」というテーマで、ネイティブはつらかったので PWA にした
    • chrome が mixed contents を許さなかったので、ssl プロキシサーバーを突貫で作ったのが個人的に一番アツかった(今考えれば AWS でやっとけよって感じだな)
    • https://github.com/team4-bba
  • 感想: 優勝したけどなんももらえなかったね!

Django で CRUD 在庫管理できるくん(2020-06)

nginx <-> Django <-> mysql, docker-compose

  • バイト
  • 担当: 二人で製作し、主にバックエンドを担当
  • メモ
    • nginx.conf とか my.cnf とか意外とシンプルで新鮮だった
    • チーム開発や git の勉強になった
    • Django と Bootstrap でサクッと
  • 感想: とはいいつつ Django の抽象化がすごくて理解するのに時間がかかった

  • 2020-06:インターンの面接や逆求人イベントに参加することになってこのページを作成した

NeoZoom @TechStudyGroup Online Hackathon (2020-05)

Figma React JavaScript Go

image

「自分の発言にフィードバックがある Zoom」

  • Zoom を使う機会が増えたので制作
  • お酒煽りや、悪口・暴言を言ったら知らせてくれる
  • 他の技術: SkyWay でビデオ通話| Golang で WebSocket | ブラウザの音声認識 API
  • 担当:
    • バックエンド担当, デザイン&全般担当, おれ の 3 人
    • 自分はフロントエンド, 特に SkyWay 部分を担当
  • メモ:
  • 感想: オンラインではじめましてだったけど、ワイワイ通話しながら長時間やるの楽しかった

札幌 ToGo (閉鎖) (2020-04, B3)

AdobeXD React JavaScript Firebase Node.js

<画像準備中 🖼>


Logpose (2020-03)

React JavaScript GAS

image

札幌の就活情報をまとめたサイト

  • Local な情報はバラバラだったし大手のサイトは広告まみれだからそれをなんとかしたかった
  • スプレッドシートや Google Form からイベント登録できる
  • 担当: おれ(全般), デザイナー, 検索機能の実装担当
  • 技術: スプシ <-> GAS(API endpoint) <-> React
  • メモ
    • はじめてしっかり React で作った
    • Techplay (スマホ view) を真似たくて頑張った
    • Hooks + Context で置き換えたい
    • APIkey などを載せちゃったのでレポジトリは非公開
  • 感想: コロナでイベント全部消えて微妙になった
  • (2021/1) また盛り上げていくぞ!← 盛り上がらなかった…

  • 2020-03
    • 突然コロナが流行る
  • 2020-01
    • JavaScript キラキラフレームワーク、手始めに Vue を勉強するも馴染まず React を勉強し始めた
    • 27 インチディスプレイを購入し、QOL が向上した

フルカラー LED テープ リアルタイムお絵描きくん (2019-12)

ブラウザ <-> Socket.io - Express - Mosquitto(mqtt) <-> ESP32 - LEDテープ


  • 2019-12
    • 学生 LT@東京 で 光る剣について発表 #初めての LT
    • 東京に集まっていた学生のレベルの高さに驚愕した

光る剣 (2019-11)

JavaScript ESP32

image

「ブラウザ操作で光る剣」

  • 色々あって、人からかっこいい剣を作ってほしいと依頼されて作った
  • 担当: 個人開発
  • 技術: ブラウザ <-> ( wi-fi AP <-> web サーバー <-> LED )←ESP32
  • メモ
  • 感想: 人のために作るの楽しかった

光るクリスマスツリー @JPHacks (2019 秋)

Django ESP32 ニトリのクリスマスツリー

image

「ブラウザで描いたデザインを送ると少し経ってからその通りに光るクリスマスツリー」

  • イルミネーション、インタラクティビティほしくない?
  • 技術: HTML Canvas | Django | ESP32 | ws2812b (LED テープ)
  • 担当: バックエンド、canvas 部分 (JS)、と「綿」を担当(4 人チーム)
  • デモサイト https://takapiro99.github.io/sandbox/jphacks2019/
  • メモ
    • はじめてチームを引っ張ったハッカソン
    • 基本情報技術者受験日と被ってたがこちらを優先させてしまった
    • 就活イベント行ったら 3 人しかいなくて意気投合してその場でチームエントリーした
    • https://github.com/takapiro99/ddtree
  • 感想: 徹夜しても実装終わらなくてもっと強くならなきゃって思った

ブラウザで畑監視くん @Web×IoT ハッカソン (2019 夏, B2)

Express socket.io Raspberry pi

image

ブラウザから家と畑が監視できて、害獣にすぐ気づける web アプリ

  • 「IoT 賞」受賞
  • 担当: 6 人(うち経験者一人)チームで、「気合で Express を勉強したが、よく分からず平凡な HTML を返すだけ」を担当
  • メモ
    • 当日、メンターの方々に助けられながら実装した
    • カメラ機能をつけようとしたが、webRTC, UDP ホールパンチング, STUN サーバー など良く分からなかった
    • https://github.com/takapiro99/webIoTChallenge2019
  • 感想
    • JavaScript でなんでもできることを知った
    • 豊富なメンター: さくらの江草さん、川畑さんとの話は刺激的だった
    • ほぼ初心者 6 人チームはつらい

  • 2019 春: 某データセンターでバイトを始める(サーバー構築など)
  • 2018 夏: Python をちょっと勉強した

4bitCPU(2018 春, B1)

汎用ロジックIC LED たくさん はんだ付け

image

  • コンピュータ動く仕組みを知りたかったが、低レイヤーすぎて電子工作だった
  • 担当: 個人開発
  • 感想: 超低レイヤーだなって思った
  • 密かに KiCad でプリント基板にしようとしている(2020/6)

  • 2018-04
    • 北海道大学に入学
    • 北大 IT 研究会(サークル)に入って機械学習を先輩から学ぶもよく分からず

怖い懐中電灯 (2017 夏, 高 3)

Arduino nano

「リモコンで操作できる懐中電灯」

image

  • 学校祭のお化け屋敷で懐中電灯を使うことになったので、遠隔操作でチカチカさせた
  • 担当: 個人開発
  • Arduino 互換マイコンと IR センサと適当なリモコンをアリエクで購入
  • メモ
  • 感想: みんな準備で忙しかったと思うけど、だれも興味持ってくれなくて悲しかった

LED cube を作ろうとした(2016, 高 2)

image

  • 8×8×8 の LED cube を作りたいと思い、ヤフオクで青色 LED を 6000 個購入した(結局作らなかった)
  • 代わりに光る抵抗マンを作った(なぜか赤い)

  • 2013 ~ 2016
    • 自転車で山や海に出かけたり、分解したりして遊んでいた

プログラミングとの出会い (2012, 中 1)

  • 中1のときプログラミングかっこいいなって思って VisualBasic の本を買った
  • 現在時刻が分かるという変なデスクトップアプリを作って終わった
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment