そんなあなたにレボリューション

【ご報告】わたくしのエンジニア活動用の公式サイトがついに完成いたしましたわ。

日記 お仕事







疲れましたわ、、疲れました。

わたくしの人生において、ここまで疲れたことがあったかしら。

それほど疲れました。


ブログを毎日、更新していたのが、もう２ヶ月以上前のことになります。

時が過ぎるのは、早いことですわ。



みなさんは、いかがお過ごしでしょうか？

わたくしは、いつも通り、楽しく過ごしております。


もうお腹が空いてしまったので、書く気がなくなってしまいました。

ほならね、






公式サイト

ecotiya.com



これ、が、わたくしの、公式サイトです。

最近、フリーランスエンジニアになって、何らかの対策を打たないと終わっちまうよな

という意味も込めて制作いたしました。


こういうのって、最近公開された、フワちゃんの公式サイトのように、

オリジナリティのあるサイトを実装したいと思ったりするけども、そんなの無理よ

この作りでも、覚えるのに時間がかかったんだから！


てか、リンク貼ったときに画像が表示されるようになりたい。










かっこつける

カッコつけて、技術の紹介をします。

frontendは、TypeScript・React・MUI(Material-UI)で実装しました。

わたくし、デザイン系の知識が全く無いので、MUIに頼りまくったけども、MUIの公式に書いてあるやつ
をパクって、自分が使いたいように

修正しただけで、あーら不思議、オリジナリティあふれる感じになりました。


これって、だめですかね？

publicリポジトリで公開しているから、だめですかね？

私のsourceも公開しているんですが、だめですかね？


もちろん、参考にしただけです。参考にしただけなんですが、だめですかね？


てか、だめじゃないわよね、もとを参考にしただけで、変更しまくってますもん。だめ？



backendは、Javaです。あとSpringBoot。ORマッパーはMybatis。

簡単ですね。将来的にはGolangに差し替えたい。

バージョンはLTSのJava17です。

でも、新しい技術は何も使用しておりません。

なんか、新しいバージョンでたら、新しい技術を使用しないといけない決まりでもあるんでしょうか？

使いたいときに、使う。そんな俺も令和の怪物か？

嘘です。ごめんなサイン会




アプリケーションはカッコつけて、AWS ECSにデプロイしちゃいました。。

otinngn、ぉちんぎん、おちんぎん、いっぱい貰わな、損ですわ。

ゲームやるより、金かかってますよね。サーバー費用が高すぎます。

おそらく最強構成になってしまっている。テコ入れしたい。


あと、Dockerとかnginxも使いました。馬鹿みたいにハマりました。楽しいんじゃなくて、わからなくて時間を投資しましたよ。

浪費ではなく、投資です。


むずい、nginxはハマった


あー絵を書きたい、リバースプロキシの設定にハマりました。

あとHTTPSの設定にしたあとにもはまりました。

あ、かくのめんどいや






案外たのしい

打算的な気持ちで始めた公式サイトづくりですが、案外たのしいってのもありました。

意外と、やりたいこともでてくる。

今後やりたいことでも書くか






えこちや、公式サイトロードマップ

問い合わせ送信時に、DiscordにWebhookで内容送信する

これ実装して、ローカルではできたけど、AWS ECS上でできない。

ECSからでられん。
LambdaとかSNSとかを使えば、出られるらしいけど、調査が必要だ。します。
本当は、Auroraにレコードがinsertされたら、Lambdaがイベントキャッチして、
Discordに登録内容をWebhookで送って欲しい。
なんかこれもありそうなので、それで対応したい。

Aurora Insert Trigger ⇒ Lambda ⇒ DIscord
こうなれんか

本当は、private subnetのECSから、何らかの手段を使って、discordにメッセージを送りつけたい。
てか実装中に気づかんもんかね、気づかないでした。
NATゲートウェイ使わないとならないんですかね、金、かかりますよね。
とりあえず、今のところは、todoとかでDB直接見るタスクを作っといて、見るようにします。
そんなにアクセスないと思いますから。




経歴欄の修正

わたしく、ぶんしょう、かんがえるの、むずい
むじいよ、むずい
これを書いているときには、終わってません。
直ってたら、終わってます。
頑張りましたね、わたくし。




行きてるだけで百万点機能の実装

やりたい。何やるかは決まっている。
あと実装した結果、ﾍ(ﾟдﾟ)ﾉ ﾅﾆｺﾚ?
こうなることまで見えている。でも、やりたい。
こういうのだけをやっていきたい。一番楽しい。
ぜんぶフロントエンドの修正でおわる。




readmeの修正

あ、普通にいります。
やらんといけません。




表示フラグのバグ修正

ウェブサイトに表示している内容は、基本的にAurora MySQLから取得してます。
で、各コンポーネントは、DBに表示フラグ持っててそこで、コントロールできます。
だけど、ヘッダーの項目が連動してないんです。
これ、直さなきゃならんのです。
でもこれをやるには、ヘッダーのロジックを切り出して細分化しなきゃならんのです。
めんどぃいいいいいい。やります。
これを一番最初にやったほうが良いでしょう。どこ直せばいいかが大体わかる。
なのに、AWS上でDiscordにWebhookする方法を調べちまってた。
わからなさすぎて、嫌になっちまうよ。




Github Actionsを利用して、AWSにDeployできる仕組みの構築。

Github ActionsからAWSのコードビルド、コードデプロイ経由でECSに配信する仕組み構築したい。
てか、手動でデプロイするのがめんどい。
間違えて、WEBサイトが表示されんくなることがあるんだが、ハマる。
マジで分からない。これをやめたい。無駄ですこんなの。
だから、自動化、大事ですね。金？　モーマンタイですわ。
ECSはバックエンドとフロントエンドのサービス、分けてますが、バックエンドをデプロイすると、
フロントエンドもデプロイしなおさないとつながらなくなっちまう。
なんでだろうか
フロントエンドからバックエンドの接続は、名前空間を使ってやってます。
なんか関係あるんかね、名前空間だから関係ないのでは？




ECRのバージョン管理

僕、今、全部、latestなんです。
これじゃだめだろ、分かる。分かるよ、本当は、イメージタグに「ver1.00」こんなのつけたい。
版数上げていきたい。
やらんといけません、いけないっぴ
デプロイして、表示されなくなったってなったら、すぐさま前のバージョンに戻したい
でも果たしてそこまで備える必要があるんだろうか？




テーマの切り替え(ダークモード、ライトモード）

これやりたいです。
個人的には、ダークモードが好きなので、ダークモードで表示したい。
でもこれ、めちゃくちゃめんどい、
たぶん今まで、書いたやつの中で一番面倒な可能性がある。
おそらくこれをすると、全面見直しが必要になる。
あとロゴとかが、ダークモードに対応していない。
ロゴをダークモードバージョンに対応させるために、フォトショップか？
フォトショップを買わなきゃならんのか？　私、破産しますわよ。
ちなみに、フォトショップでなるかどうかは、わかりんせん
なんかアドビーのソフトをサブスクで契約しますわ。まだ先の話ですがね。




Home画面に全体の色を変更する機能を追加。赤/青/黄色　等、デフォルトの色を決める。

これ、当初はやってみたかったんですが、ダークモード・ライトモードの切り替えを実装したら
いらんくなりますよね。
ちなみに、難易度的にはこっちのほうが遥かに楽です。
ただ、負けた気がするんすよね。こっちが実装されていたら、あ、負けたんだな、

そう思っといてください。




画面表示時に、時計みたいなのを画面中央に表示させる。1～2秒。

これかっこよいから、やりたい。ただどうやってやればよいのかは、正直全くわからんです。
ちなみにこれをやりたい理由は、公式サイトを表示した瞬間に、「404」みたいな文字が見えますよな？
それを隠したい。

これ、Java側から、画面に表示するデータをもらってきてるんですけども、
react側では、画面表示した初回のみ、JAVA側にアクセスしたい
だから、useEffectってのを使って、取ってんですが、
これが、公式サイトを表示してから動いてんですかね？

まあ何にせよ404が表示されなきゃいい、
ちなみに三項演算子で、JAVA側からデータとれたら、全データ表示で、とれなかったら404です
うーん、最初の目的は404を表示させたくないから、時計で隠しといて
取り終わったときにちょうど、私の公式サイトで
404が見えないよになりたい。

意味、伝わっておりますでしょうか？
ちょっと、お腹が痛いので、もう思いついた順序で書きまくってます。
トイレに行けば、終わる話なんですが、いいところなんです。
でも、もう終わります。




お知らせコンポーネントの追加

公式サイトができました。
みたいな、お知らせできる箇所を作りたいです。ただ、別に一般のエンジニアなので、
それが必要かどうかが、わからん。
恐らく必要ない。けど、なんかほしいよなと思っている。
でもいりません。ここに書いてから、考え直し、優先度が下がりました。




ボクセルアートを公式サイトに配置する

これはやりたい。ボクセルアートの本を買って、ちゃんと勉強してやりたい。
なんか私のモチーフとなりそうなキャラクターで作って、公式サイトで展開したい。
なんか、ボクセルアートがあるホームページかっこいいですよね？




トランジションを使って、ホームページ全体をぱっと表示させたい

MUIのトランジションを使って、スクロールで該当のコンポーネントが画面範囲内に入った瞬間に表示させる機能です。
今だと、画面表示した瞬間に全部表示なので、あんまり驚きがない気がしております。




プロフィール画像をS3から取ってくる

プロフィール画像のURL自体は、DBに持つようにしていて、あとS3へのVPCエンドポイントも用意しているので、あとやるだけな気がする。
というか、あとやるだけなのに、VPCエンドポイントに課金され続けるんです。
何もやってないのに！

怯えます。





ここまで、が現段階でやりたいことです
優先度が低とか最低のタスクもあって、上記以外にもやりたいことはあるんですが、
もう、いつまで経っても終わらなくなるので、それはそのうちで。

というかどこまで、やればいいのか、何を目指しているのかも、わたくしには、わかりんせん。






いろいろと

まー、やり始めるとやりたいことはたくさん出てきますね。
ゲームするよりか、楽しいかもしんない。

いや、ゲームはゲームで楽しいですね。


なんか、バグ報告とか文字がおかしいとかあれば、連絡ください。
このブログの匿名コメントか、

公式サイトの問い合わせフォームで「公式サイトについて」で連絡待ってます。
まあなんでもよいです。


今、問い合わせはDBに保存するだけなので、私が自ら見に行かないと漏れるようになってるんですよね。
本当はDiscordにWebhook通知したい。そしたらDiscordアプリの通知をコントロールすれば、確認できる。
ローカルではできたのよ。あーおしい
またLambdaとSNSを学ばないとならん。これはちょいと時間をもらうので、段階的に進めていきたい。






最後に

公式サイトはまだ完成しておりません。
ベータ版です。
ただ、いつまで経っても終わらないという状況が続くと心理的に良くないので、とりあえず公開しました。
最終的には、zennとかQiitaで書きたいですね。ちゃんと。
見てもらわなきゃ、意味ないですもんね。

どこで、どういう風に使っていくか、っていう話はまた別であるんですが。


本来の目的である、仕事に活かせるものにしたい。
まあ何かに繋がるといいですね。
どうやったら、SNS経由で仕事をいただけるか、そうしたことも考えることになるかもしれませんが、
エージェント経由での仕事募集にしても、公式サイトの存在が無意味になることはないと信じたい。

今のところ、仕事があるので、次の仕事に向けた、わたくしの準備だと思ってください。
なんかバグとか、ここ文言微妙だなとかあったら、教えてください。


本当は、親に見せたいんですが、Twitterとかブログとか見られたくないので、躊躇してます。
どうしようか。

でも、これ、仕事に使うので、見ようとしたら、見られる可能性があるんです。
わたし、馬鹿かもしれません。

八九寺真宵です。


以上、ここまでご覧いただきありがとうございました。



次回、私のやりたいことでも書きます。
やりたいことがたくさんあるんです。


てか、公式サイトにはガチっぽく書いてますが、ブログでは、適当に記載しているというのはどういうことになるんでしょうか？

人に見られることをもろ意識して実装してますよ。
こっちのブログは意識していません。


どうすればよいでしょうか。
正直、ブログを消すくらいしか方法が思いつかないです。
でもそれするんなら、Twitterも消さなきゃ意味ないですよね。
消しませんけども。




あ、忘れてた

サドンアタックの第三補給倉庫をやっていたときに、一生聴いていた音楽ランキング、第5位。
www.youtube.com





以上、またお会いしましょう。


お腹すきました。

てか、わたし、それ言ったっけ？
ってことがあるんですが、ここに書いてるからですかね？

まあいいか。


^p^