クリエイティブ系のウェブサイト制作で役立つCSS技法 / CSS for develop creative website

MTDDC Meetup TOKYO 2024 2024/11/23 株式会社サイバーエージェント 原 一成 (@herablog)

こんにちは。コミュニケーションアプリ「LINE」のモバイルクライアントを開発している石川です。 この記事は、毎週木曜の定期連載 "Weekly Report" 共有の第 51 回です。 LINEヤフー社内には、高い開発生産性を維持するための Review Committee という活動があります。ここで集まった知見を、Weekly Report と称して毎週社内に共有しており、その一部を本ブログ上でも公開しています。（Weekly Report の詳細については、過去の記事一覧を参照してください） 確信的な質問 ある開発者が、以下の関数 getOnlineUserStates のコードレビューの依頼を受けた状況を想定しましょう。 fun getOnlineUserStates(userIds: Set<UserId>): Map<UserId, UserState> { if (userI

なんだか最近React Nativeに関する投稿が増えている気がしますね。 筆者も本投稿を準備していたところ、先に投稿が増えてきたので二番煎じ感が否めませんが、少し俯瞰的な整理としてご覧いただければと思います。 React Native界隈は近年盛り上がってきていて、特にExpo関連の進化を中心に、パフォーマンスも開発効率も大幅に改善されてきています🔥 具体的にどのように盛り上がっているのか、 React Conf 2024のKeynote（Day 2） がYoutubeで公開されており、非常に分かりやすくまとまっていました。 本記事はこの動画の流れに沿って、見どころをチャプターで切るように紹介しながら、関連情報やその後のアップデートの話もできればと思います。 ※React Conf 2024は5/15・16に開催されたものです 動画前半： React Nativeがいかに盛り上がってい

Deleted articles cannot be recovered. Draft of this article would be also deleted. Are you sure you want to delete this article? はじめに 今回は生成AI関連の知識を学ぶことができる資料をまとめました。 有名企業や大学が公開しているものを厳選しています。 対象者 生成AIの概要を知りたい人 ChatGPTのプロンプトテクニックを知りたい人 AIの基礎を学びたい人 AI関連 AI関連は入門的な内容を学べる資料を厳選して3つ紹介します。 本当にわかりやすいAI入門 AIの基礎的な話から、実践的な活用事例までを網羅的に学べる資料。 AIとは何か 脳の仕組み 伝わりやすさと境界の決め方 課題を乗り越えるための取り組み 文章生成の仕組み AIのこれから AI研修【MIXI

ポリシー: この世界では常に最新版を使うという気持ちで生きていく Node.js は枯れるという概念がなく、常に古いことはリスク という認識。LTS も短め(3年) 古いAPIのドキュメントは常に消失する モダンなツールは、モダンな前提を要求する ~2020: CJS/ESM 関連で断絶がある(jestが動かなくなりつつある) ~2019: パフォーマンス意識が低い時代の実装が多い ~2015: Node.js のみでしか動かないものが多い。peerDeps の意識が低い この辺で目視でポチポチする npm: npm-check-updates - npm yarn upgrade-iteractive pnpm upgrade -i サーバーランタイムには安定を、ツールチェインにはパフォーマンスを サーバーランタイム(Node.js) Node 本体は Stable LTS か、一つ前の

声に革命を。Aivis Project が切り拓く、感動の音声体験。 Aivis Project は、感情豊かな音声合成技術を誰もがかんたんに活用できる未来を目指す、 壮大な開発プロジェクトです。 機械的な響きに留まらない、まるで魂を宿したかのような音声が、あなたの想いや言葉に豊かな感情をのせて 世界へと響き渡る。Aivis Project が描く未来は、これまでにない感動と驚きに満ちています。 好きなキャラクターの声で物語を紡ぎ、理想の声でニュース記事に命を吹き込む。 そうした新しい表現が、私たちのプロダクトを通じて数クリックで実現します。 AivisSpeech でのローカル音声合成から、モデルの制作・ミックス・公開まで、Aivis Project は 誰もが自由に好きな声を共有できる未来を形にしていきます。 これまで一部の才能や特別な環境だけが手にできていた魅力的な声を、各々のアイデ

はじめに 私は初めてDependency Injection（依存性注入）という概念に出会ったのは、NestJSのドキュメントを読んでいるときでした。その時、providerや@Injectable()は何なのか？といった素朴な疑問を感じましたが、ドキュメントを読んでもすぐには理解できず、そのまま一度放置しました。 最近、業務で触れているAPIサービスではNestJSではなく、InversifyJSというライブラリを使用してDependency Injectionを実装しています。これを機に、DIについてもう一度学び直すことにしました。そして、自分が調べて理解したことをまとめて共有したいと思います。 この記事では、以下のような疑問に答える形で情報をまとめています： Dependency Injectionは何？なぜ使うのか？ Dependency Injectionはどのように実装されてい

はじめに こんにちは！株式会社マチス教育システムのいけふくろうです。 実務で商品管理画面を実装する機会があり、その際に得た知見をもとに、設計・実装プロセスや留意点について紹介させていただきます！！ フェーズ1の完成品 コスト（人的、予算）及びスケジュールの兼ね合いから、最低限のスコープでミニマムに設計・実装をおこなったため、至らない点は多々ありますが、作ったアプリケーションはこちらです💁 機能一覧 アカウント管理 ユーザーの管理機能とロール設定機能 テナント管理 各オーナーに対して複数のテナントを紐づけ、オーナーごとにテナントを一元管理できる機能 商品管理 商品情報の基本機能として、カテゴリー、商品基本情報、属性情報、商品画像の管理機能 ※商品基幹システムとの連携部分は未実装、ユーザー向けの注文サイト連携部分は未実装であることからJANコード管理などの機能は含めていない 在庫管理 主力商

こんにちは、普段はプロダクトマネージャをしつつエンジニア界隈にも首を突っ込んでいるku-sukeです。最近では個人や少人数チームでアプリやサービスを使ってリリースする人も増えましたね！その中でも「いままでは個人向けにサービスを作ってきたけど、法人のひとから問い合わせが来た」とか「B2Bって取引金額が大きそうだから興味がある」あとは自分で運営していなくても「B2BのSaaS企業に転職したけどB2Bわからん」という声をちらほら目にしたので、自分が知っている範囲でまとめようと思います。 🔰はじめに。B2Bってなんなん 個人開発者の人からするとこの時点で違和感があるかもですが、Business to Businessつまり事業者間取引のことです。個人の方もビジネスをしている以上は個人事業主ですので立派な事業者です。 これと対比して、個人消費者向けにビジネスする、あるいは広告など個人が使用すること

前書き React Developer ToolsはReactの公式開発者ツールであり、日常的なコンポーネント開発において、属性やファイルの位置特定、propsのトラブルシューティングなど様々なシーンで重要な役割を果たしています。熟練したReact Developer Toolsの使用は日常の開発をより効率的にすることができます。 この記事では、React Developer Toolsプラグインを体系的に理解することができます。本文では以下のことを学ぶことができます： コンポーネントの一時停止や遅延読み込みシナリオのシミュレーション。 コンポーネントに対応する実際のDOMを早く特定する方法。 props内の特定の関数がどこで作成されているかを早く特定する方法。 コード変更なしで、propsを介したコンポーネント変更をオンラインで検知する方法。 コンポーネントがどのファイルで作成されたかを

本記事では、RAGの性能を高めるための「Plan×RAG」という手法について、ざっくり理解します。株式会社ナレッジセンスは、エンタープライズ企業向けにRAGを提供しているスタートアップです。 この記事は何 この記事は、RAGの文脈消える問題を克服する新手法「Plan×RAG」の論文[1]について、日本語で簡単にまとめたものです。 今回も「そもそもRAGとは？」については、知っている前提で進みます。確認する場合はこちらの記事もご参考下さい。 本題 ざっくりサマリー Plan×RAGは、RAGの精度を上げるための新しい手法です。アールト大学とMicrosoft Researchの研究者らによって2024年10月に提案されました。 ざっくり言うと、Plan×RAGとは、「計画を立ててから検索する」手法です。Plan×RAGでは、ユーザーの質問を、まず最初に小さな単位に分解。その後、それらの関係性

- 線形代数・回転の表現 - 株式会社 セガ 開発技術部 こちらからも↓PDFをダウンロードできます https://techblog.sega.jp/entry/2021/06/15/100000

この記事では、「アジャイルはウォーターフォール時代の何を反省するのか」「アジャイルで何が改善するのか」について、個人的な考えを説明します 極端なことを言っている部分はあるので、誤解している箇所や異論があれば、やさしくコメントで教えていただければ幸いです 言いたいこと 「ウォーターフォール＝諸悪の根源」というのは誤解で、問題は請負契約にある 請負契約で「顧客の真の要望が実現されない」のは当然、インセンティブ設計がおかしい 日本版のアジャイルソフトウェア開発宣言には「外注よりも内製を」と書くべき 競争に勝つためには内製化は進む(でも内製化はとても難しい) ベンダーへ「君はアジャイルをやるか迷える立場じゃないよ」 目次 用語 ウォーターフォールは本当に諸悪の根源か？ 「ウォーターフォール＝諸悪の根源」という誤解 問題の原因は請負契約 なぜ請負契約は失敗しやすいのか？ ベンダーは「システム開発だけ

Deleted articles cannot be recovered. Draft of this article would be also deleted. Are you sure you want to delete this article? 概要 いまさらだけども理解しているつもりできちんと理解していなかったIAMについて、改めて勉強したので忘れないようにまとめる。 参考にした資料： 【AWS Black Belt Online Seminar】AWS Identity and Access Management (AWS IAM) Part1 【AWS Black Belt Online Seminar】AWS Identity and Access Management (AWS IAM) Part2 ※この記事で利用しているSSは上記資料内のものです。詳しく知りたい方

マネージャーは「面倒なことをやってくれる人」なのか 最近マネージャーな方を「面倒なことをやってくれる人」として認識されていることがあります マネージャー自身が「そう思っていますーハハハ」と言っていることもありますし、「マネージャーって開発に関係のない面倒なことをやる役割でしょ？」って言われることもあります なんなら「面倒なことはマネージャーが全部やるからさ」とメンバーに言っている場に居合わせたこともあります マネージャーは「面倒なことをやってくれる人」なのでしょうか 「面倒なことをやってくれる人」と思われる背景と影響 「面倒なことをやってくれる人」として扱われているマネージャーの共通点を自分なりにまとめたところ、自身の業務を明示していないのではないかな？と思いました 自身がやっている業務を自身で説明できない or しないため、その専門性やキャリアを示すことができない状態です 結果としてメン

こんにちは。 ファインディでソフトウェアエンジニアをしている栁沢です。 ファインディの各プロダクトでは、1日に複数回デプロイしています。 例えば、私が所属するFindy転職のプロダクトでは、1日に6回ほど本番環境にデプロイしています。 高いデプロイ頻度でもデプロイ起因による障害や不具合がほぼ発生しておらず、開発スピードと品質の両立を実現できています。 今回はファインディ社内でのFeature Flagの使い方について詳しく解説します！ Feature Flagを使うことのメリット Feature Flagの実現方法 Feature Flagを使った開発の流れ 1. Feature Flagを追加する 2. Feature Flagを使って新機能を実装・テストコードを書く 3. 検証用の環境で動作確認を実施する 4. 動作確認が完了したら、本番環境で機能を有効化させる 5. 一定期間の安定稼

import { formatDate } from './dateUtil.ts' const text = formatDate(new Date(), 'YYYY年M月D日(曜)'); console.log(text); // 2024年11月9日(土) 日付フォーマットはJavaScript標準のtoLocaleDateStringを使っています。 関数のオーバーロードを使うことで、フォーマットごとの説明をIDE上で表示させています。 フォーマット文字列はdayjsを参考にしています。 プレイグラウンド ↓で実際にVSCodeのインテリセンスが動くのでぜひ試してみて下さい。 長所短所 この方式の長所・短所を↓にまとめてみました。 個人的には１つのアプリで使うフォーマットが数パターンに収まる場合、長所の方が勝つんじゃないかと考えています。 長所 IDEの補完が便利 アプリケーション

Lodash is dead. Long live Radash. 記事は上記記事を意訳したものです。 ※当ブログでの翻訳記事は元サイト様に許可を得て掲載しています。 Lodashの何が問題なのか？ 関数の詳細分析 Lodashの_.get関数 Lodashの_.filter関数 Lodashの_.map関数 コード品質 でも、そのコミュニティは... では、どうするか？ try関数 parallel関数 retry関数 counting関数 range関数 list関数 Lodashの何が問題なのか？ JavaScriptの動的な能力が欠点ではなく特徴として捉えられていた時代に、Lodashは異なる入力に対して異なる振る舞いをする関数を提供することで、できる限り役立つように作られました。現在では、私たちはより良い方法を知っています。純粋関数、決定論的な振る舞い、関数合成といった関数型のコ

DDDからOOPのプラクティスを学ぶのではなく、OOPのベストプラクティスをスタイルガイド本で学んでDDDに活かそう