Webフロントエンド入門
まずはじめに HTML、CSS、JSを学んだ後にモダンなweb制作を行う上でこれから何を学べばいいだろうと手探り状態だった過去があるので、今同じ悩みを抱えている方に向けてこの記事を書こうと思いました。また、自分自身が2023年に多くのことを学んだのでそれの整理になればという思いもあります。 あと、いいね、コメントいただけると記事作成の励みになります😇 この記事の対象者 HTML, CSS, JSはある程度理解した モダンなWeb制作を行いたい これから学ぶべき技術 React, Next.js 一度は聞いたことある人も多いと思います。これは、Webサイトを効率的に開発することを目的に作られたJSのフレームワーク(正確にいうとReactはライブラリ)です。 ReactはFacebook社が開発したもので、それをVercel社がより使いやすくしたものがNext.jsです。 作成するものによっ
Your code displays Japanese wrong
A static site to link people to when their code is displaying Japanese wrong. View the Project on GitHub heistak/your-code-displays-japanese-wrong Why am I here? If someone gave you a link to this page, that person probably thinks your code displays Japanese wrong. In short, from a native Japanese eye, yѳur ҭєxҭ lѳѳκs κιnd ѳf lικє ҭЋιs. This page will give you a brief description of the glyph appe
150万MAUのNuxt.js製サービスを機能開発を止めずに1ヶ月&1人でNext.jsに置き換えた話
Nuxt.js で開発されていたAI受診相談ユビーのフロントエンドを Next.js で作り直しました。 まだまだ仮説検証を繰り返すフェーズのスタートアップのため、機能開発を止めて一気に置き換えることはできず、機能ごとに少しずつ置き換えてリリースをしました。結果、5人のプロダクト開発チームによる機能開発と並走して、全体の移行を1人で1ヶ月の短期間で終わらせることができたので、その意思決定や過程、工夫を紹介します。 移行前の課題 まず前提として、移行前の Nuxt.js による実装は 2018 年に立ち上がったもので、当時 toC の Web サービスを持っていなかった Ubie が ほぼ 1 人の小さいチームで PoC 的に作り始めたものでした。また、当時の Next.js は今ほど多機能ではないプレーンなフレームワークでした。 これらを踏まえて、当時の状況で MVP を最速で作るための技
フロントエンド強化月間 - 開発する上で知っておくべき知見を共有しよう 結果発表🚀 - Qiita Blog
こんにちは、Qiita運営スタッフです。 4月26日（月）より開催中の記事投稿イベント フロントエンド強化月間 – 開発する上で知っておくべき知見を共有しよう へのたくさんのご参加、誠にありがとうございます！ 今回のイベントでは、合計169名の方にご参加いただき、69本もの記事が投稿されました！ ご投稿いただき誠にありがとうございます🎉 フロントエンドライブラリの紹介や、パフォーマンス向上テクニックなど、開発体験、ユーザー体験を向上させるような記事を多数ご投稿いただくことができました。 今回はご投稿記事の紹介とLGTM数ランキングを発表いたします！ Qiita運営ピックアップ記事たくさんのご投稿の中から、Qiita運営がおすすめ記事をピックアップしました！ まだ記事を確認できていない方はご参考にしてみてください！ ざっくり、フロントエンド開発のためのバックエンドサービスを整理する by
最小手数で始めるTailwind CSS - メドピア開発者ブログ
パクチーパクパク小宮山です。 掲題通りTailwind CSSの始め方を最小手数で書いていきます。余談は一切ありません。 tl;dr CSS管理は諦めてTailwind CSSを使おう。 Get Started tailwindcss.com ひたすら公式通りに進めます。例によってフロントエンドプロジェクトの環境構築はひたすら面倒なので、Tailwind CSS以外のツールチェインはなるべく使わない構成を目指します。 installします。 $ yarn init $ yarn add tailwindcss セットアップします。 $ yarn tailwindcss init こういうファイルが作られました。 tailwind.config.js module.exports = { purge: [], theme: { extend: {}, }, variants: {}, plu
キャラクターを描いて学ぶ、ゼロからはじめるCSS図形 - mojiru【もじをもじる】
エンジニアからクリエーターにスキルアップ！ゼロからはじめるCSS図形 技術の泉シリーズ 「エンジニアからクリエーターにスキルアップ！ゼロからはじめるCSS図形」発行主旨・内容紹介 「エンジニアからクリエーターにスキルアップ！ゼロからはじめるCSS図形」目次 「エンジニアからクリエーターにスキルアップ！ゼロからはじめるCSS図形」Amazonでの購入はこちら 「エンジニアからクリエーターにスキルアップ！ゼロからはじめるCSS図形」楽天市場での購入はこちら※電子書籍版 エンジニアからクリエーターにスキルアップ！ゼロからはじめるCSS図形 インプレスグループで電子出版事業を手がけるインプレスR&Dは、最新の知見を発信する「技術の泉シリーズ」として、Webクリエーター・林智史氏著書による様々なキャラクターをCSSで描いて学べる「エンジニアからクリエーターにスキルアップ！ゼロからはじめるCSS図形」
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
[301] メンテナンスページのHTMLの書き方 - Qiita![[301] メンテナンスページのHTMLの書き方 - Qiita](https://cdn-ak-scissors.b.st-hatena.com/image/square/02ce8fc6c30884d949a907af89ec1cb67d4429f9/height=288;version=1;width=512/https%3A%2F%2Fqiita-user-contents.imgix.net%2Fhttps%253A%252F%252Fcdn.qiita.com%252Fassets%252Fpublic%252Farticle-ogp-background-412672c5f0600ab9a64263b751f1bc81.png%3Fixlib%3Drb-4.0.0%26w%3D1200%26mark64%3DaHR0cHM6Ly9xaWl0YS11c2VyLWNvbnRlbnRzLmltZ2l4Lm5ldC9-dGV4dD9peGxpYj1yYi00LjAuMCZ3PTk3MiZoPTM3OCZ0eHQ9JTVCMzAxJTVEJTIwJUUzJTgzJUExJUUzJTgzJUIzJUUzJTgzJTg2JUUzJTgzJThBJUUzJTgzJUIzJUUzJTgyJUI5JUUzJTgzJTlBJUUzJTgzJUJDJUUzJTgyJUI4JUUzJTgxJUFFSFRNTCVFMyU4MSVBRSVFNiU5QiVCOCVFMyU4MSU4RCVFNiU5NiVCOSZ0eHQtYWxpZ249bGVmdCUyQ3RvcCZ0eHQtY29sb3I9JTIzMjEyMTIxJnR4dC1mb250PUhpcmFnaW5vJTIwU2FucyUyMFc2JnR4dC1zaXplPTU2JnM9YmMyNGE4YjUwYWVlYzEyNGE4ZWRhMWI5ZGJkMjA0NGI%26mark-x%3D142%26mark-y%3D57%26blend64%3DaHR0cHM6Ly9xaWl0YS11c2VyLWNvbnRlbnRzLmltZ2l4Lm5ldC9-dGV4dD9peGxpYj1yYi00LjAuMCZoPTc2Jnc9NzcwJnR4dD0lNDBzdHVkaW8xNSZ0eHQtY29sb3I9JTIzMjEyMTIxJnR4dC1mb250PUhpcmFnaW5vJTIwU2FucyUyMFc2JnR4dC1zaXplPTM2JnR4dC1hbGlnbj1sZWZ0JTJDdG9wJnM9MzJlNzBiNWU3YWE3NmQ1MDM0ODkxNDEwMjJjYWJkZGM%26blend-x%3D142%26blend-y%3D436%26blend-mode%3Dnormal%26txt64%3DaW4gUWlpdGFkb27jg6bjg7zjgrbjg7zkvJo%26txt-width%3D770%26txt-clip%3Dend%252Cellipsis%26txt-color%3D%2523212121%26txt-font%3DHiragino%2520Sans%2520W6%26txt-size%3D36%26txt-x%3D156%26txt-y%3D536%26s%3D31e1b7dccbd925406b89c390a82d1d72)