Web制作の技術は日々進化しており、会社やプロジェクトによっては昨今の環境に適さない書き方をしているケースも時折見受けられます。 そこで今回は「2024年のWeb制作ではこのようにコードを書いてほしい！」という内容をまとめました。 質より量で、まずは「こんな書き方があるんだ」をこの記事で伝えたかったので、コードの詳細はあまり解説していません。なので、具体的な仕様などを確認したい方は参考記事を読んだりご自身で調べていただけると幸いです。 1. HTML 画像周りはサイトパフォーマンスに直結するので、まずはそこだけでも取り入れていただきたいです。また、コアウェブバイタルやアクセシビリティも併せて理解しておきたい内容です。 Lazy loading <img>にloading="lazy"属性を付けると画像が遅延読み込みになり、サイトの読み込み時間が早くなります。

こんばんちは、スーパー太っちょWebディレクターです。 スーパーは太っちょにかかります。 先日、こんなことをX（Twitter）でつぶやきましてね。 社内外問わず、「あいつら（他部署やクライアント）は全然わかってない」はよく聞く話なのだけど。だが、そもそもちゃんと説明してないことも多々あるんですよね。そりゃ違う仕事してるんだから説明しないとわかるわけがないのに。 ちゃんと丁寧に説明すれば、理解してくれる人もたくさんいますよね。 — toksato（とくさと）｜むめいなうぇぶディレクター (@toksato) May 8, 2024 そして、その後日、こんな素晴らしいインタビュー記事を読みまして。 仕事の進め方がグダグダの会社はどうすればいいのか、「プロジェクトマネジメントの基本が全部わかる本」の著者に聞いてみた | Agend(アジェンド) 僕もこれをリアルに社内でやってるなぁと思って。ま

自然言語でWebサイトを作れる「Create」 KEITO（以下、KEITO）：はい。次は、今ものすごく話題になってる「Create」です。 池田朋弘氏（以下、池田）：知らないです。 KEITO：ご存じないですか。この1週間でめちゃくちゃ話題のサービスになっていて、自然言語でWebサイトを作れるものなんですけど。ChatGPTでもコードを吐き出したりできるので、Webの形を作るのはなんとなくできそうだとは思うんですけど。Createだと、その作ったWebサイトに機能を入れることができるんですよね。 具体的に言うと、この右側が、僕が作ったやつです。「KEITOチャットAI」と言って、「こんにちは」と送れば、裏側でChatGPTが動作してしっかりと返してくれる。このチャットボットを、本当に30分ぐらいで作りましたね。しかも僕、プログラミングなんて一切できないので。本当に自然言語だけで「チャット

僕が開発しているWebフレームワークHonoは、同じJavaScriptのフレームワーク、Expressと比べられることが多いです。どちらもやれることはほぼ同じですが、HonoのアドバンテージはファーストクラスでTypeScriptをサポートしていることです。特に「RPC」機能は他のフレームワークにはなかった「TypeScriptの型でサーバーとクライアントの仕様を共有する」ことを可能にしています。今回はそのHonoのRPCについて紹介します。 どんなものか まず、どんなものかを箇条書きで共有します。 Web APIの仕様、特にインプット・アウトプットをサーバーとクライアント間で共有するためのもの OpenAPIやgRPCを使ってやりたかったことを叶えるかもしれない サーバーとクライアントをどちらもTypeScriptで書くことが大前提である 同種のものにtRPCがあるが、Honoの場合、

tl;dr はじめに 2024 年の 4 月 24 日に Node.js 22 がリリースされました。ESM を 条件付きで require する機能や、--run フラグによる npm スクリプトのパフォーマンス改善などが v22 で追加され、2009 年に Ryan Dahl が Node.js をリリースしてから 15 年が経つ今も、Node.js は進化を続けています[1]。 こうして Node.js 自身が強化されていくにつれ、以前はサードパーティーのパッケージを使用して実現することが一般的であった機能が Node.js のみで実現可能となり、当該パッケージが不要となるような場合があります。冒頭に引用した Ben Holmes の動画では、そのように不要となったパッケージとして dotenv node-fetch chalk mocha が挙げられていますが、この記事では「これら

Understanding What Matters for LLM Ingestion and Preprocessing Imagine a world where all of your organization’s unstructured data lies at your fingertips. A mere prompt and your LLM application unlocks deep insights from a labyrinth of documents, emails, and reports. This isn’t a distant sci-fi dream; the technology exists, but how do you get there? In the heart of every modern organization lies u

組織には構造化されたデータベースやきれいにフォーマットされたCSVのほか、何気なく書いたメールから複雑な技術マニュアルまでさまざまな形式のデータが大量に保存されています。検索拡張生成(RAG)は大規模言語モデル(LLM)を使用して全てのデータから適切な情報を引き出すための技術ですが、RAGを使用する際にデータの取り込みと前処理をどのように行うと効率的なのかを、RAG向けデータ前処理サービスを展開するUnstructuredが解説しました。 Understanding What Matters for LLM Ingestion and Preprocessing – Unstructured https://unstructured.io/blog/understanding-what-matters-for-llm-ingestion-and-preprocessing LLMを最大限に

はじめに 📘 この記事は ラクス Advent Calendar 2023 の7日目の記事になります。 要件定義から基本設計、さらに実装や保守運用に至るまでの一貫した経験を何度か積んできましたが、毎回 「要件定義って具体的に何の項目が必要だっけ？」 「基本設計との違いって何だったっけ？」 「基本設計と詳細設計の区別って？」 といった疑問が頭をよぎってきました。 そんなわけで、これまでの経験を振り返りつつ、開発プロセスについて１からまとめていくことで頭の中の大掃除を行なっていきたいと思います🧹 この記事の対象者 🎯 開発プロセスについて学びたい方 要件定義の基本を学びたい人 要件定義と基本設計の違いがわからない人 一緒に開発プロセスについて復習したい方 前提 記事中の一部（特に要件定義や基本設計、詳細設計のサンプル）を自動生成で作成してます。一貫性の無い内容があるかも知れませんが、あく

"I'm Feeling Lucky" - Building Great Search Experiences for Today's Users (#IAC19)

A few years ago most API designers, developers, and technical writers would have had very little reason to bump into JSONPath, but its starting to get more and more relevant as more tools and standards start relying on it. So what is JSONPath, what is it used for, and how can you get up to speed with using it? JSONPath is a query language that can be used to extract data from JSON documents, which

私たちはスクラムを採用していて、プロダクトオーナーの私と、3人の開発者、そしてスクラムマスターというチームでやっている。 初期段階の頃は、頭の中のユーザーストーリーを開発者に伝えるのをめちゃくや丁寧にやっていた。 リファインメントでたくさん会話して、バイブスを伝えることに多くの時間を費やしていた。 たくさんの会話をしそれを簡潔にテキストに落とし込みバックログを完成させていた。 プランニングの時も開発者の帽子を被り、必要があったら口を挟みつつラジオ参戦していた。 数ヶ月も一緒にやっていると「今ある機能をもっと良くするならこうだよな」というのが開発者の中に思い描けるようになっていたし実際合っているので、リファインメントでたくさんの会話しなくても「あとはお任せ」の様にやれるようになっていた。 バックログを積み、リファインメントで意思疎通できてるな、ヨシ、をシュッと確認して、その後のテキストへの落

ちょっとした雑なスクリプト書いてそれを常に起動しておきたいときないですか？僕はあります。 しかもめんどくさがり屋なのでghq管理化のディレクトリでgemに頼って雑に書いたスクリプトがそのまま動いてほしいんです。 systemd使えば出来るんだろうなぁと思いつつ「色々面倒くさいんだろうな」と思って手を出していなかったんだけどやってみたら拍子抜けするほど簡単だったので共有です。 雑要件定義 rubyはrbenvで管理してるんでそれそのまま使ってほしい 実行ファイルをgit&ghq管理化のディレクトリでそのまま使いたい 他の場所にインストールとかコード管理ダルい bundle exec 的なのもやって依存ライブラリもうまいことやってほしい やること systemdをユーザーレベルで使うときは ~/.config/systemd/user/にファイルを置けば良い。ディレクトリ無かったら作る mkd

今回答えを出したい問いはこちら！！ インデックスはどのような仕組みを以て、何を実現したいものなのか それを踏まえたとき、インデックスはどういう場合になぜ貼る方が良いのか。また、どういう場合になぜ貼らない方が良いのか 大体分かっているよって人はサヨナラって感じのおさらい記事だぜ！！！！それじゃいってみよー🎉 あと、おれは今回MySQLにしぼっていくぜ👶 ってわけでOracleとかに興味があるやつは引き返しな！ indexの概要 公式の見解としては「where句を使ったselectクエリの実行速度を向上させるために実装されている、各行へのポインターのような振る舞いをする仕組み」って感じ👶 The best way to improve the performance of SELECT operations is to create indexes on one or more of t

最近、AIがとても話題になっていますね。ただ、この分野は非常に技術の成長スピードが速く、正直今のAI分野の技術に全くついていけていないという方も多いと思ったため、今話題になっているAI技術についてわかりやすくまとめました。 現状の主なモデル一覧 まず、現状の主なLLMの一覧について紹介していきます。 GPT GPTはOpenAIが開発しているLLMです。現状だとGPT-4が最新です。GPT-4は月額20ドルの有料プランでのみ利用できます。GPT-3.5は無料で使えます。 Claude ClaudeはAnthropicが開発しているLLMです。現状だとClaude3が最新です。Claude3は日本語にも対応しています。 Claude3にはOpus, Sonnet, Haikuの３種類があり、Opus > Sonnet > Haikuの順に能力が高いです。Opusは月額20ドルの有料プランでの

Markdown形式でメモを作成できるサービスのObsidianが使用しているObsidian Canvasファイル形式を「JSON Canvas」ファイル形式としてオープンソース化することを発表しました。 JSON Canvas — An open file format for infinite canvas data. https://jsoncanvas.org/ Announcing JSON Canvas: an open file format for infinite canvas data - Obsidian https://obsidian.md/blog/json-canvas/ 仕様についてはjsoncanvas.orgに記載されています。サイトにアクセスするとこんな感じ。右下の「Toggle output」をクリックしてみます。 右側にJSON Canvas形式

CodeZine編集部では、現場で活躍するデベロッパーをスターにするためのカンファレンス「Developers Summit」や、エンジニアの生きざまをブーストするためのイベント「Developers Boost」など、さまざまなカンファレンスを企画・運営しています。

しゃいん @shine_sann 情報系の人たちが、「バカでもできるようになる」くらいの意味で「民主化」って単語を誤用しているらしいですね。まあ、情報系って、理系の中でも、プログラム言語しか話せず、日本語を話せるバイリンガルの少ない分野ですからね。仕方ない仕方ない。許してあげてください。 2024-03-21 15:20:35

バルテス・ホールディングス株式会社の小島氏は、自身が社内キャリアカウンセラーとして受けてきた相談から、年代別キャリアのよくある悩みと、その悩みを解決するための対策と、キャリア開発の基本ステップについて紹介します。全2回。 バルテス・ホールディングス株式会社について 小島友美氏：本日、前半の話を進める、バルテス・ホールディングス株式会社の小島と申します。よろしくお願いします。 本日は「多忙な30代／40代のPM／PLが自分らしく働くために知っておくべきキャリア開発の基本ステップ」と「品質エキスパートという選択肢」の紹介をしていきたいなと思っています。 今案内があったように、Q&Aの機能やリアクションの機能をうまく使いながら、インタラクティブに進めていきたいので、ぜひ意見などもらえればと思っています。 あと、「Zoom」のリアルタイムアンケート機能というものがあって。みなさんのキャリアの悩みを

はじめに どうも、元QAのエンジニア @Syahu_Writer です。 今回は、元QAが開発チームにjoinしてから行った品質向上のための施策について紹介していきます。 大なり小なりいろいろとやってますが、代表して以下3つを話します。 ・開発プロセスの改善 ・シナリオテストケーステンプレートの改善 ・不具合の再発防止 開発プロセスの改善 以下は当初の開発フローを図に書き起こしたものです。 この図から読み取れる問題点はざっくりと、 ・すべて直列のフローだが、並列処理にしていいものも混じっている ・テスト完了レビューといった、不要で実際に行われていないものがある ・レビューのタイミングが悪く、大きく手戻りが発生する箇所がある という状態でした。 それを以下の通り修正しました。 ・並列にして問題ないものは並列にする ・不要なプロセスは削除する ・手戻りが最小限となるようにレビューを設置する ま

𝕏 𝕃（おおきなえる）🌸⚒️ @ellnore_pad_267 雑談垢だよ。 ホロ沼にハマッているよ。 消費税を納税しているよ。 ふぁぼは既読マークだよ。 ＲＴは賛同じゃあないよ。 フォロバはしないよ。 Amazon アフィプログラムに参加してるよ。 ホロ箱推し member of 🌸⚒️🐏🌽🥐 sugaryo-pad.hatenablog.com