🐕

短縮リンク作成サービスを開発した話

2024/02/13に公開

概要

2023年末頃に、短縮リンク作成サービスを開発・リリースしました。きっかけとしては、大手の短縮リンクサービス「bit.ly」をはじめ、類似のサービスにて改悪が立て続けに起きていたことです。もっと便利で簡潔なものが作れるのではと思い、開発してみました。
開発したサービスは以下のものになります。

技術選定

開発するにあたり、どのような技術(ここでは言語など)を使用して開発するかの選定を行いました。N-LIA開発開始時点での、私の開発経験は以下のような感じです。

  • PHP: 3年 (Laravelなどのフレームワークは未経験)
  • React: 半年
  • MySQL/MariaDB: 3年

短縮リンクサービスの開発を始めるにあたり、DB設計などを考えてみると意外と簡単そうだと感じました。そこで、今回のテーマは「未経験のモダンな技術を使って開発してみる」ということにしました。
ということで、今回採用した技術などは以下の通りです。
フロントエンド

  • 言語: Javascript(Next.js)
  • サーバー: Vercel

バックエンド

  • 言語: PHP(Laravel)
  • サーバー: XServer

実装について

実装については、実際のコードを紹介しながら別途記事を作成する予定です。ここではどのような構成かを書きます。
リンクを作成する場合

  1. ユーザーがフロントエンドのページを表示
  2. フォームに入力後、「リンクを作成」ボタンを押下
  3. ボタンが押下されたらreact-hook-formを使用してバリデーションチェック
  4. 問題なければaxiosでLaravelのAPIに渡す
  5. 渡された情報をもとにMariaDBに登録

リンクにアクセスされた場合

  1. 注意画面を表示
  2. 登録されたリンク(アクセス先)を取得
  3. 注意画面のボタンにアクセス先を設定

詳細の記事は、来週以降に順次公開予定ですので、フォローして気長にお待ちいただけると幸いです。
→ 続編を公開しました!
https://zenn.dev/yatsumi823/articles/github-zenn-shorten-link-frontend-01-yatsumi

名前について

公開後にN-LIAの名前の由来を聞かれることがあるので。一応、適当に考えた名前です。短縮リンクは、短くなければ意味がありません。また、サイトの信頼性を挙げたいと考え、末尾は「jp」になることが前提でした。また、.の前は最大でも4文字程度に抑えたいと思っていました。4文字でたまたま取得できた文字列が、nliaでした。(入れてみたら取得できたので他の文字列でもおそらく問題ないです)。すべて大文字にして「N」と「LIA」の間に「-」を入れたらかっこよさそうだなと思い、「N-LIA」にしました。一応、読み方としては「エヌリア」です。

まとめ

今回初投稿なので、ちょっと薄い内容ですが、技術的な記事を3記事程度続けて公開予定ですのでお手柔らかにお願いします。
今回のメインは、使用している技術構成などで、実はモダンな言語が使われているということです。

ちなみにZennを始めようと思ったきっかけは、前職のパワハラ上司に「文章力がない。技術記事とか読んでるの?いや、その文章力の無さは読んでないってことなのよ」という軽いパワハラ的なものを受け、記事を書けば文章力が上がるのではと思ったところからです。

今回の記事は、以上になります。今後ともよろしくお願いいたします。

続きの記事

https://zenn.dev/yatsumi823/articles/github-zenn-shorten-link-frontend-01-yatsumi

Discussion