Webフロントエンド入門
まずはじめに HTML、CSS、JSを学んだ後にモダンなweb制作を行う上でこれから何を学べばいいだろうと手探り状態だった過去があるので、今同じ悩みを抱えている方に向けてこの記事を書こうと思いました。また、自分自身が2023年に多くのことを学んだのでそれの整理になればという思いもあります。 あと、いいね、コメントいただけると記事作成の励みになります😇 この記事の対象者 HTML, CSS, JSはある程度理解した モダンなWeb制作を行いたい これから学ぶべき技術 React, Next.js 一度は聞いたことある人も多いと思います。これは、Webサイトを効率的に開発することを目的に作られたJSのフレームワーク(正確にいうとReactはライブラリ)です。 ReactはFacebook社が開発したもので、それをVercel社がより使いやすくしたものがNext.jsです。 作成するものによっ
TL;DR: jQueryはDrupalのバーター リニューアルするたびにWeb界隈の一斉レビューを受けることでお馴染のデジタル庁ポータルサイトがいつの間にかまたリニューアルされていて、フロントエンドがNext.jsからDrupalに変わって話題になっていたので1、私も旅券所持者として国政に関心を持ってゆく また、まわりのフロントエンドエンジニアの間でjQuery氏の入庁について「モダンブラウザ全盛の時代に必要か？」と疑念がとなえられていたので、これも追求してゆきたい どのような変更があったのか システム変更の経緯はプロジェクトの関係者であるHal Sekiさんの発言が正確なところだと思う Drupalが話題ですが、元々CMS側は2年前からずっとDrupalだったんです。設立当初はサイトもシンプルだったのでフロントエンド側はNextjsでヘッドレス構成だったのですが、構成が複雑になってきて
鈴木たかのり（@takanory）です。今月の「Python Monthly Topics」では、Python製の静的サイトジェネレーターSphinxを使用してWebサイトを構築し、テーマを適用、外部へ公開する流れについて紹介します。後半ではSphinxの便利な拡張機能を紹介し、Webサイトをより便利にしていきます。 Markdownでドキュメントを書くだけで、きれいなWebサイトが簡単に公開できるので、ライブラリのドキュメントなどでもよく使われています。 Sphinxとは SphinxはPython製の静的サイトジェネレーターです。静的サイトジェネレーターとは、Markdown等の軽量マークアップのテキストファイルから、静的なWebサイトを生成するアプリケーションのことを言います。Python製の静的サイトジェネレーターにはSphinxを含め以下のツールなどがあります。 Sphinx：h
はじめに こんにちは。Webフロントエンドチームの山口です。 この記事では、N予備校の規約類を microCMS で管理して、運用を改善した取り組みについてご紹介します。早速ですが、前置きは抜きにして本題に入りたいと思います。ぜひお付き合いください！ 背景、前提 N予備校では、基本的な 利用規約 の他、定期的に開催されるキャンペーンの応募規約など、様々な規約を公開しています。 中野信子講座での著書プレゼント企画 受講者参加型お悩み相談企画 総数は年々少しずつ増加しており、記事の執筆時点で23件もの規約が存在します。これらは全てプロダクトのコードベースにハードコードされており、開発チームが社内のステークホルダーから変更依頼を受け付ける形で管理されていました。 新しく規約を追加することもあれば、既存の規約に変更を加えることもあります。開発チームは依頼元と必要なコミュニケーションを取りながら対応
※本記事は、技術評論社「Software Design」(2024年1月号)に寄稿した連載記事「Google Cloudを軸に実践するSREプラクティス」からの転載1です。発行元からの許可を得て掲載しております。 はじめに 前回はDatadogによるクラウド横断のモニタリング基盤について解説しました。 今回はCloudflareとは何か、なぜ使っているのか、各サービスとポイント、キャディでの活用例を紹介します。 ▼図1 CADDiスタックにおける今回の位置付け Cloudflare とは 本記事では、Cloudflare社が提供しているプラットフォーム全体を「Cloudflare」とします。 Cloudflareは、ひと昔前までは数あるシンプルなCDN(Contents Delivery Network)サービスの1つでした。CDNとは、コンテンツの配信を最適化するためのネットワークです。
2024年1月24日 CSS, Webサイト制作 制作時に「CSSファイルをこれ以上増やしたくない…」「クラス名を考えるのしんどい…」なんて思ったことはないでしょうか？私はあります！あれこれ試した結果、Tailwind CSSが使いやすかったので、導入時につまづいたポイントと解決方法をまとめてみます。 ↑私が10年以上利用している会計ソフト！ Tailwind CSSとは Tailwind CSSは、あらかじめ多くのクラスが用意されているCSSフレームワークです。Webサイトを制作する時に、HTMLの要素に直接、定義済みのクラスを付与して使用します。基本的に1つのクラスに1つのスタイルが当てられていて、例えば「m-0」というクラスをつけると margin: 0px; が、「w-full」というクラスをつけると width: 100%; が加えられます。 実際にどんなものか見たほうが早そうで
私たちに最も寄せられる質問は次のようなものです： RemixはNext.jsと一体どう違うの? この記事では私たちはこの質問を答えるべきのようです！私たちはこの議題をストレートに、そして何の感情的な議論なしに言及していきたいと思います。もしあなたがRemixのファンになってくれていて、この記事を見て、今すぐにでもNextよりもRemixの方がすごいぜ 😎、と自慢するようなツイートをしたい気持ちが出てきたとしても、もしできれば、自慢するというような形ではツイートをなるべくしないようにお願いしたいです。私たちは Vercel で働いている方々と Vercel が立ち上がる前から友達です。そして、彼らのやっていることはとても素晴らしく、私たちは彼らを尊敬しています。 ただ、勘違いをしてほしくないのは、私たちはRemixはNext.jsよりも優れている特徴があると思っています。（そうでなければ、
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
デジタル庁でjQueryが何をしているのか - laiso
Python製静的サイトジェネレーターSphinxでWebサイトを構築して公開 | gihyo.jp
N予備校の規約類を microCMS で管理して、運用を改善した取り組み - ドワンゴ教育サービス開発者ブログ
第10回:Cloudflareの紹介と運用のポイント - CADDi Tech Blog
Tailwind CSSを使う時の疑問と解決方法
Remix vs Next.js - React Japan