ほぼ毎日動くプログラムの投稿 #100DaysOfCode 終わったので総まとめだにゃん!

100日投稿って大変だにゃん。ちょっと時間が空いたけど、作ったプログラムをカテゴリ別にまとめるにゃん。
19

主要な成果

100日間プログラミングで得られた主な成果

  • 自分のHPをゼロから作ってweb公開するスキル
  • Processingでアート作品を作るスキル
  • Unityでゲーム制作するスキル(さわりだけ)

投稿ルール

おがくず @mikenerian

今日から #100DaysOfCode やろうと思うにゃん。 昔はProgateのキャンペーンとかで日本語ツイートも時々あったにゃんけど、今はほとんど見かけないにゃんね。 きっと #駆け出しエンジニアと繋がりたい が日本ではメジャーにゃんね。 シンプルに毎日投稿目指してプログラム作るにゃん。(続く)

2023-01-29 20:51:10
おがくず @mikenerian

●どんなつぶやきをするのか? - 自分で書いて動かしたプログラム(成果物)のデモ - とにかく動画で「動くもの」を見せることにこだわる - 題材に縛りはなく、Webページ、ゲーム、データベース何でもあり

2023-01-29 20:51:27
おがくず @mikenerian

- ノーコードも自分が理解していて、面白いものならアリ - 自分自身の知識蓄積、技術向上が目的のため、役立つ、役立たないはとりあえず二の次 - きっと100日目にはあっと驚くようなプログラムが作れるはず

2023-01-29 20:51:41
おがくず @mikenerian

●おがくずが現時点で持ち合わせるスキル - 一通りのIT知識(プログラム書けるかは別問題) - 基礎情報は未取得 - 機械学習はE資格取得レベル - AWSはAWS SAA取得レベル - 大学の授業1コマを受講して身につく程度のHTML、CSS、JS、C#、Javaに関する知識 - PythonはAtCoderで茶色(雑魚)

2023-01-29 20:53:05

Webページ作成

HTML, CSS, JavaScript辺りから始まり、webフレームワークと呼ばれるツールを色々試してホームページやWebアプリを作ろうとする試み

HTML, CSS, JavaScriptで作成

ゴリゴリプログラムを書くスタイル。今どき本番環境でやってる人いる?!

おがくず @mikenerian

1日目 簡単なwebページ。animateとjQueryで動きをつけてみたにゃん。 参考書籍:動くWebデザインアイディア帳 [amazon.co.jp/dp/4802613237](amazon.co.jp/dp/4802613237) #100DaysOfCode #駆け出しエンジニアと繋がりたい pic.twitter.com/i0nYNOT9Ub

2023-01-29 20:55:55
おがくず @mikenerian

2日目 簡単なWebページ。JavaScript (JS) とjQueryで動きをつける。1日目との違いはJSで直接動きを指定していることにゃん。 参考書籍:動くWebデザインアイディア帳 amazon.co.jp/dp/4802613237 #100DaysOfCode #駆け出しエンジニアと繋がりたい pic.twitter.com/bISKf02YmS

2023-01-30 21:12:32
おがくず @mikenerian

9日目 簡単なWebページ。以前作ったヘッダの下に、表を作ってみたにゃん。 別にこの後データベースを作る伏線ではないにゃん。 #100DaysOfCode #駆け出しエンジニアと繋がりたい pic.twitter.com/A4nlf40DwH

2023-02-06 23:11:32
おがくず @mikenerian

10日目 簡単なWebページ。前回表を作ったページにフッタをつけたにゃん。フッタだけレスポンシブなページになってしまったにゃん。 参考:naaavi.com/footer-design-… #100DaysOfCode #駆け出しエンジニアと繋がりたい pic.twitter.com/FM8Drf05cW

2023-02-07 23:36:01
おがくず @mikenerian

13日目 簡単なwebページ。10日目にフッタをつけたページに、入力フォームっぽい画面を作ったにゃん。CSSを身につけるにはボタンいじりからと言うけど、なんとなくわかってきたにゃん。 参考:yuyauver98.me/contactform-co… #100DaysOfCode #駆け出しエンジニアと繋がりたい pic.twitter.com/r2810ANg98

2023-02-10 23:17:12
おがくず @mikenerian

14日目 簡単なwebページ。JavaScriptを書いて、13日目に作成したフォームに何かを入力し、ボタンを押すと入力内容が表示されるようにしたにゃん。 #100DaysOfCode #駆け出しエンジニアと繋がりたい pic.twitter.com/Ehz0xGdrlL

2023-02-11 17:45:32
おがくず @mikenerian

19日目 今回は座学で失礼するにゃん。 エンジニア必読(?)の雑誌「Software Design」を読んでみた。ちょうどJavaScriptについて書かれていた特集があったので、勉強した内容を公開するにゃん。 gihyo.jp/magazine/SD/ar… #100DaysOfCode #駆け出しエンジニアと繋がりたい pic.twitter.com/RfWqiKYRVk

2023-02-16 20:18:27
拡大
おがくず @mikenerian

25日目 日程調整メーカーのボタン修正。マウスオーバーしたときや、押したときの処理をCSSで追加するだけで、ちょっとボタン押してる感覚が伝わらないかにゃ?! #100DaysOfCode #駆け出しエンジニアと繋がりたい pic.twitter.com/2NNk5Jwo8X

2023-02-22 22:23:30
おがくず @mikenerian

43日目 HTMLの勉強。 以下のサイトで、美しいデザインのwebサイトを調べることができるにゃん。 screenlane.com この中から比較的シンプルで個人ページの参考になりそうなものを、地道にコピーしていくにゃん。 arcade.software/blog #100DaysOfCode #駆け出しエンジニアと繋がりたい pic.twitter.com/xKdoZwVqyv

2023-03-12 21:56:07
おがくず @mikenerian

44日目 HTMLの勉強。地道なコピーを始めたにゃんけど、CSSの順番が合わないのか、ヘッダだけでもぜんぜん違う形になってしまったにゃん。。別の勉強法を模索するにゃ #100DaysOfCode #駆け出しエンジニアと繋がりたい pic.twitter.com/sIFvG1YSJm

2023-03-13 21:12:32
拡大
拡大

ワイヤーフレーム、モックアップのお試し

Webページの下書きツールのお試し。Figmaがやっぱりお手軽。プロはこれを基にプログラム書くってマ?

おがくず @mikenerian

23日目 Flaskアプリのワイヤーフレーム(簡潔だけど)をFigmaで作成して、HTMLコードを出力してみたにゃん。 若干ずれてるけど、かなり精度高いにゃん。 #100DaysOfCode #駆け出しエンジニアと繋がりたい pic.twitter.com/FV9xtvE3yq

2023-02-20 21:22:30
おがくず @mikenerian

24日目 Figmaから出力したHTML、CSSに沿って日程調整メーカーのレイアウトを調整したにゃん。 やってみると意外とずれていて修正方法もよくわからず、CSSの沼にはまりかけたにゃん。 #100DaysOfCode #駆け出しエンジニアと繋がりたい pic.twitter.com/xqyOLTbhez

2023-02-21 21:11:31
おがくず @mikenerian

49日目 Figmaの勉強。 使えば使うほど独自概念に詰まってしまったので、MayukoさんのFigmaの使い方講座で勉強してみたにゃん。超絶わかりやすくて助かったにゃん。完全に理解した()にゃん。 youtu.be/HfkP06pZfAc #100DaysOfCode #駆け出しエンジニアと繋がりたい pic.twitter.com/bMcVdsB7IJ

2023-03-18 23:23:45

フレームワークやDBのお試し

Node.jsはもはや当たり前品質?!

おがくず @mikenerian

15日目 簡単なwebページ、の改良に向けた準備、までだにゃん。 node.jsのインストールとmysqlのインストール。localhostでmysqlの起動までいきたかったけどエラーがなかなか直らない。。 #100DaysOfCode #駆け出しエンジニアと繋がりたい pic.twitter.com/MNAKbFR0KP

2023-02-12 20:46:09
1 ・・ 6 次へ