An open API service indexing awesome lists of open source software.

https://github.com/sigma7863/sigma7863.github.io

My Portfolio
https://github.com/sigma7863/sigma7863.github.io

github-action json nextjs tailwindcss

Last synced: 5 months ago
JSON representation

My Portfolio

Awesome Lists containing this project

README

          

# 技術スタック
## アナリティクス
### Umami(オープンソース)
アナリティクスのサービスは、企業向けのものが多く、またアナリティクスを収集するスクリプトをTypeScript用に書き換えたり、XSS対策をしないといけなかったりする必要があるので、使えるサービスが限られていました。

その中で、導入しやすかったうちの一つが、Umamiだったので、採用しました。

[Umami 公式サイト](https://umami.is/)

[Umami リポジトリ](https://github.com/umami-software/umami)

## フレームワーク
### Next.js(オープンソース)
ポートフォリオにはあまり適していないかもしれませんが、採用した理由としては使ってみたかったという単純な理由です。

[Next.js 公式サイト](https://nextjs.org/)

[Next.js リポジトリ](https://github.com/vercel/next.js)

### Tailwind CSS(オープンソース)
Tailwind CSSは、CSSのフレームワークで、HTMLのタグのクラスに直接CSSを割り当てられるので、便利です。

ただ、可読性が減るので、大規模なチームでの開発など使うのにはあまり適していません。

[Tailwind CSS 公式サイト](https://tailwindcss.com/)

[Tailwind CSS リポジトリ](https://github.com/tailwindlabs/tailwindcss)

## ライブラリ
### Lucide(オープンソース)
Lucideは、リンクに飛ぶアイコンや、バッテリーのアイコンなどがReactなどのJavaScriptライブラリで使えるアイコンライブラリです。

Wappalyzer(ブラウザの拡張機能)を使って色々なサイトを見ていた時に見つけたので導入してみました。

自分のポートフォリオでどこで使っているかは容易に分かると思うので、当ててみてください。

[Lucide 公式サイト](https://lucide.dev/)

[Lucide リポジトリ](https://github.com/lucide-icons/lucide)

[Wappalyzer -Chromeウェブストア-](https://chromewebstore.google.com/detail/wappalyzer-technology-pro/gppongmhjkpfnbhagpmjfkannfbllamg?hl=ja&utm_source=ext_sidebar)
### Motion(旧Framer Motion)
Motionは、ReactやVueなどに使えるアニメーションライブラリで、色々なアニメーションを実装できます。

このポートフォリオでは、ハンバーガーメニューを開いた時のアニメーションに使いました。

~ほぼすべてAIに書いてもらった。~

[Motion 公式サイト](https://motion.dev/)

[Motion リポジトリ](https://github.com/motiondivision/motion)