Skip to main content

References

Overview​

エンジニアとしての知識を深めるためのウェブサイトまとめ。

技術系ニュースサイト​

  1. TechCrunch（アメリカ） TechCrunch 技術系ニュースやスタートアップ情報を提供する人気サイト。
  2. Wired（アメリカ） Wired 技術、科学、カルチャーに関する広範なニュースをカバー。
  3. The Verge（アメリカ） The Verge 技術、科学、エンターテインメントに関するニュースとレビューを提供。
  4. Ars Technica（アメリカ） Ars Technica 深い技術分析記事やレビューを提供するサイト。
  5. Slashdot（アメリカ） Slashdot 技術系ニュース、ディスカッションフォーラム。
  6. Smashing Magazine（ドイツ） Smashing Magazine ウェブデザイン、開発に関するニュースとチュートリアル。
  7. Dev.to Dev.to 開発者によるブログ、ニュース、コミュニティ。
  8. InfoQ InfoQ InfoQのアーキテクチャーカテゴリー ソフトウェア開発に関するニュース、アーティクル、ビデオ。 アメリカ
  9. DZone DZone 開発者向けのニュース、チュートリアル、ツールのレビュー。
  10. Reddit Technology（アメリカ） Reddit Technology 技術関連のニュースやディスカッションが行われるコミュニティ。
  11. Hacker news Hacker News 優秀なハッカーが興味を持つものなら何でも。ハッキングやスタートアップ以外のものも含まれる。 一文にまとめると、答えは「知的好奇心を満たすものなら何でも」となるでしょう。
  12. GeeksforGeeks GeeksforGeeks GeeksforGeeksは、コンピュータサイエンス、プログラミング、アルゴリズムに特化したオンライン教育プラットフォームです。初心者から上級者までの幅広いレベルのプログラマーに向けて、問題解決能力や技術スキルの向上を目的としたチュートリアルや問題集を提供している。 なかなか参考になる
  13. javatpoint javatpoint プログラミングやテクノロジーに関する無料のオンライン学習リソースを提供している教育プラットフォーム なかなか参考になる。

webサイトまとめ​

かっこいい・おしゃれなWebデザイン参考サイト・ギャラリー集【海外・国内】 2024 年のインスピレーションを与えるブログ ウェブサイトの例トップ 33

  • awwwardsは、デザインとクリエイティビティに優れたウェブサイトを評価し紹介しているサイト。デザインのトレンドやアイデアを得るのに最適。
  • プロフェッショナルおよび新進アーティストの作品を紹介するサイトで、参加型プロジェクトやコミュニティ活動も行っている。シンプルながらもアートに重点を置いたデザインが特徴
  • 持続可能な技術を推進するウェブサイトで、パララックススクロール機能やインタラクティブな背景が特徴。

web制作に使えるサイト​

Grid​

Gridが視覚的に作成できる。 CSS Grid Generator

css translateに使える​

参考URL

css filter:drop-shadowジェネレーター​

画像の形に影を落とすのによく使われるfilter関数のdrop-shadowを確認するためのジェネレーターです。 filter:drop-shadowジェネレーター

css box-shadowジェネレーター​

box-shadowジェネレーター

css グラデーションジェネレーター​

参考URL

css ジェネレーター​

なんか色々ある

モダンなサイトにする方法​

参考URL

さまざまなフォントの画像を作成できる​

参考URL

GitHubなどでフォントが切り替えられないときに使用する​

参考URL

CSS cubic-bezierをコピペで作成できるサイト​

おしゃれなサイト​

見つけたおしゃれなサイト これを参考にする。

使えそうなデザイン​

ただそれをまとめる。

デザイン収集​

Webデザインの参考になるギャラリーサイト24選【2022年9月版】

現場で使えるFlexboxレイアウト12​

参考URL

font​

サイトを彩るフォント（日本語） 参考URL

text​

CSS Text Effects keyframe animation

デザインを探すサイト​

このサイトがやばい これもやばい

aboutで使える​

横からスライドイン自己紹介 参考URL aboutで使えそう TimeLineで使える aboutで使える

Loading​

Loadingで使える これも使える

スキルシート​

ひとつひとつの項目に使えるかも

カード​

カード一覧 カード一覧2 クリックするとグラフが出る すごいカード トランジションカード

テーブル​

テーブル一覧

Grid layoutの初歩​

参考URL

button​

button一覧

layout​

マガジンレイアウト

hover​

テキストにホバーするとカーソルに画像が追従 hover card

GSAP​

ScrollTrigger Demos

Resume(レジュメ) 自分の概要​

Resume Templates

ギャラリーに使える​

ギャラリー一覧 参考URL 斜めに画像を配置 ギャラリーサイトとして参考になる

購買システム​

参考URL

フライヤー​

フライヤー一覧

ポートフォリオに使えるのでは​

参考

タスク管理ツールとかいいかも​

参考URL

ハンバーガーメニュ-​

headerがレスポンシブでハンバーガーメニューになる

メンバー紹介に使えるかも​

参考URL

tag design​

参考URL tag code pen

矢印 allow​

おしゃれな矢印

code pen これもカテゴリー絞るなどいける

慣性スクロール​

参考URL(大元) これを日本人が緩和したやつ これ導入するだけでreact/nextいける

横スクロール​

CSSだけで この横スクロールはすごい（Locomotive Scrollを使っている）

アニメーションTips​

縦スライダー 縦スライダー(code pen) Cube line animation（GSAP ThreeJs）