タグ

otoのブックマーク (4,599)

  • 人に優しいフォームを作ろう、特に日本人に

    皆さん、フォーム作ってますか? Webサイトやアプリを作るにあたって避けられないのがForm作成、多くの方が autocomplete を設定するなど、より使いやすいフォームを作成するために尽力されていることと思います。 一方で、悪気なく書いたコードでより使いにくいフォームになってしまっている例が世の中には多く見られます(特に銀行系) 今回は、よくあるフォームの実装を例に、(特に日語話者にとって)より使いやすいフォームにするためのちょっとした仕様や私が考える対策を書いていこうと思います。 忙しい方のために最初に書いておくと、この記事に書いてあることの多くは autocomplete の仕様を意識した実装をしましょう の一言に集約されます。 多くの方にとっては「何を当たり前のことを」と思われる項目も多いかとは思いますが、当たり前のことがされていないフォームが世の中には多すぎるので、少しでも

    人に優しいフォームを作ろう、特に日本人に
  • 埼玉にある、武者小路実篤が作った社会主義っぽい村落共同体へ行く - 今夜はいやほい

    「暇だね」 「暇だねえ」と配偶者は答えた。 じゃあどこか行こうかということになったのだけど、埼玉のぱっと思いつくようなところはすでに訪問済みの場所が多く、どこに行けばいいのか分からなかった。 「湖でも行く?」僕はGoogleマップで適当にスワップを続けていた。 「涼しげでいいね。そうしようか」 ということで、タイムズカーシェアの車に乗り込み、Googleマップで見つけた、比較的近くにある鎌北湖なる湖に行ってみることにした。 湖だった。 「湖だね」 「そうだね」という会話をした。あまり深く調べもせずに、とりあえず来てみたら、結果、特に大した特徴もない、言葉の通りのただの湖だった。 とりあえず、写真を何枚か撮り、伸びをして、少し散歩して、事足りてしまった。 は気持ちよさそうに眠っていた。 当座の目的は達成された。やや不完全燃焼の感は否めないが、まあ他にすることもないし帰るかと車に乗ってしばら

    埼玉にある、武者小路実篤が作った社会主義っぽい村落共同体へ行く - 今夜はいやほい
  • 【図解解説】これ1本でGitをマスターできるチュートリアル!【完全版】 - Qiita

    Deleted articles cannot be recovered. Draft of this article would be also deleted. Are you sure you want to delete this article? はじめに こんにちは、Watanabe Jin(@Sicut_study)です。 今回は記事1で初心者が必要な知識を全て学べるGitチュートリアルを紹介していきます。 世の中にはたくさんのGitに関する教材があります。しかし、真に良いと思える教材はありません。 もちろん私も4年前はGitという言葉を知らない状態から、書籍などで学習をしました。 しかし、書籍で知識を得たとしても実際にコマンドを使って実践的に学んだわけではなかったのでほとんど身になりませんでした。 私が思う世の中にあるGitの教材のイケてない点は2つです。 結局ほとんどの

    【図解解説】これ1本でGitをマスターできるチュートリアル!【完全版】 - Qiita
  • 舞い散る薬莢,吹き飛ぶ残骸,撃ち放題のあらゆる装備で敵兵器をぶっ壊せ! 美少女×ミリタリー×ドット絵「Nitro Express」試遊レポ[TGS2024]

    舞い散る薬莢,吹き飛ぶ残骸,撃ち放題のあらゆる装備で敵兵器をぶっ壊せ! 美少女×ミリタリー×ドット絵「Nitro Express」試遊レポ[TGS2024] 編集部:Igarashi 東京ゲームショウ2024のPLAYISMブースに,2025年リリース予定の新作タイトル「Nitro Express」(ナイトロエクスプレス)が試遊出展されている。作は,Grayfax Softwareが開発する,2D横スクロールのガンアクションゲームで,美少女×ミリタリー×アニメ風ドット絵という,相性抜群の要素で構成されたゲームだ。 作の舞台は,架空の東京都特別行政区「内瀞市」(ないとろし)で,プレイヤーは,内瀞市警察の特殊部隊「例外車両処理班」(AVDS)に所属する少女を操作する。 この世界では,「コンパニオン」と呼ばれる自律型ドローンが日常に溶け込んでおり,警察用語ではそれらを「例外車両」と呼称してい

    舞い散る薬莢,吹き飛ぶ残骸,撃ち放題のあらゆる装備で敵兵器をぶっ壊せ! 美少女×ミリタリー×ドット絵「Nitro Express」試遊レポ[TGS2024]
  • おまえたちが文句ばかりいって一向に読もうとしないから、代わりに『大転生時代』を読んでやったぞ。 - Something Orange

    ただ、これ、読み終えたからいえるのですが、なろう小説はあまり関係ないんじゃないかなあ。 最初から最後まで舞台は現代社会だし、「転生」という概念をキーに物語が進むことはたしかであるものの、逆にいうとそれだけのことでしかなく、「なろう小説らしさ」はほとんどない。 なろう的なものからインスパイアされていることはたしかだとしても、とくになろうに対するパロディ性とか批評性も感じない。いちおうネタバレを避けたうえでいうなら、SFとしてもそこまですごい作品ではないと思う。 ただ、それなら箸にも棒にも掛からぬ駄作なのかといえばそこまででもない感じではあるので、ぼくの感想は「うーん、普通?」というどうにも煮え切らないものになってしまう。 しょうじき、「読む前は見下していたけれど、思わぬ傑作でした!」とか「あまりのつまらなさに大草原不可避wwwwwwwwww」みたいなことを書けたら良いと思うのだが、どうもそう

    おまえたちが文句ばかりいって一向に読もうとしないから、代わりに『大転生時代』を読んでやったぞ。 - Something Orange
  • WebサイトやスマホアプリのUIに! 抽象的で美しいSVGの背景デザインを簡単に作成できる無料ツール -Mossaik.app

    最近のWebサイトやスマホアプリで見かける、ウェーブやポリゴンやブロブなどの抽象的で美しいSVGの背景デザインを簡単に作成、カスタマイズできる無料ツールを紹介します。 カスタマイズはかなり柔軟性があり、色や形、数、角度、カラーモードなどを変更でき、サイズはデスクトップ用、タブレット用、スマホ用が揃っています。 Mossaik.app Mossaikは、Webサイトやスマホアプリ、デスクトップ、タブレット、スマホ用の抽象的で美しいデザインの背景を作成できるオンラインツールです。作成したデザインは、SVGとPNGでエクスポートでき、商用でも無料で利用できます。

    WebサイトやスマホアプリのUIに! 抽象的で美しいSVGの背景デザインを簡単に作成できる無料ツール -Mossaik.app
  • もしもいま、Rustをイチから学び直すとしたら? Rust入門書著者・matsu7874さんに聞く学習ロードマップ - Findy Engineer Lab

    めまぐるしく変化するテックの世界。技術を身に着けるうえで学ぶべきポイントや学習環境なども年々変わっています。 そこで「もしもいまの環境で、テックのことをイチから学び直すことになったら、自分はどんな風に勉強したいか」というIFストーリーを通じて、技術との向き合い方を考え直してみる企画「テック転生」。 今回は『Rust実践プログラミング入門』共著者の松健太郎(@matsu7874)さんに“自分だったらこう進めたい、Rustの学習ロードマップ”をご寄稿いただきました。 無理なく2ヶ月でWeb開発をRustで始めるロードマップ 株式会社estieでソフトウェアエンジニアをしているmatsu7874です。2024年8月の今、イチからRustを学び直すロードマップ(あるいはリソースガイド)を考えてみました。仕事の合間にやっていくとして数週間、長くとも2ヶ月くらいでRustで開発している会社に入っても

    もしもいま、Rustをイチから学び直すとしたら? Rust入門書著者・matsu7874さんに聞く学習ロードマップ - Findy Engineer Lab
  • 資料生成AI「Napkin」がマジすごすぎる。

    以下の記事などで既にかなり話題になっていますが、ぼくも触ってみました(使い方などの詳細はこちらの記事を参照してください)。 結論としては、マジすごくてかなり衝撃的です。すべてのホワイトカラーワーカーにとって、かなりディスラプティブなツールになるのではないでしょうか。 自分はコンサルタントでして、これまでにたくさんの資料を作ってきてスキルを磨いてきたつもりだったので、AIポン出しでここまでのものが出てきてしまうと、正直、人生について考えさせられちゃいますね。 この記事では、Napkinを使ってどういう資料ができたのか共有したいと思います。 ポストモーテムの勉強会をしたいなと思っていたので、まずはChatGPTで資料の骨子を出力し、それをNapkinに入力してみました。それで得られたのが、以下の資料です。 スライド1: タイトルスライド タイトル: ポストモーテムの教科書 副題: SREにおけ

    資料生成AI「Napkin」がマジすごすぎる。
  • 使わないのはもったいない! GA4の便利機能「オーディエンス」を活用しよう(寄稿:小川卓) - はてなビジネスブログ

    株式会社HAPPY ANALYTICSの小川卓(id:ryuka01)です。 Google Analytlcs 4 (以下、「GA4」)には「オーディエンス」という機能があります。 筆者がGA4で一番好きな機能なのですが、セミナーなどでお話しているとあまり使われていない機能だなと感じております。 そこで今回はオーディエンス機能とはどういう機能なのかを紹介し、その活用方法についても触れていきます。 オーディエンス機能とは? オーディエンスの設定方法 1. オーディエンス名を設定する 2. 条件を設定する 3. オーディエンスの有効期間を設定する 4. オーディエンスのイベント名を設定する 5. 保存する オーディエンスを活用した分析方法 セグメント機能との違いについて オーディエンスを配信ターゲットとして活用する 最後に オーディエンス機能とは?オーディエンスとは「観客」や「顧客」を意味しま

    使わないのはもったいない! GA4の便利機能「オーディエンス」を活用しよう(寄稿:小川卓) - はてなビジネスブログ
  • ウー・ウェンの炒めもの | 高橋書店

    必ずおいしくできる炒めものの秘訣を、 ウー・ウェン流「5つのメソッド」でご紹介 みんなが大好きな「炒めもの」。 書では、おうちの炒めものを劇的においしくする秘訣を「5つのメソッド」でご紹介。 丁寧な下準備と油の習性を上手に使った加熱方法で、野菜はシャキッと、炒飯はぱらりと。 おかずにはもちろん、お弁当に酒の肴に、まいにちでもべたい全83品を掲載しました。 いつもの素材でぐんとおいしく、どなたでも炒めもの名人に。 180度開くコデックス製だから、作りながら安心して使えます。

  • 「ラスボスで5時間吸われた」「今まで遊んできたゲームのラスボスでぶっちぎりの強さ」SEKIRO風弾きアクション『九日ナインソール』遊んだ人たちの反応

    てっけん🎃Hayato Ikeya @tekken8810 九日ナインソール、「SEKIROより難易度高いかも」という不穏な噂につられて触ってみたら超面白くてずっと遊んでた。今年のアクション部門暫定1位!(2周&実績コンプ) ・SEKIROクリア勢の心をブチ折りに来る高難度パリィアクション(イージーモードもあり) ・防御は回避とパリィのみの超ストロングスタイル ・ボスの攻撃を見切って全部パリィできると脳汁出る ・ラスボスの強さは後世に語り継ぎたいレベル ・のどかな田舎のお祭りからいきなりサイバーパンク世界に引きずり込まれる圧巻のSF展開 ・ケモかわキャラいっぱい(重要) ・エンディングからタイトル画面に戻る流れ良すぎてボロ泣きしました

    「ラスボスで5時間吸われた」「今まで遊んできたゲームのラスボスでぶっちぎりの強さ」SEKIRO風弾きアクション『九日ナインソール』遊んだ人たちの反応
  • デザイナーにもお勧め! CSSもThree.jsもタイムライン編集を可能にするTheatre.jsが凄い - ICS MEDIA

    デザイナーにもお勧め! CSSもThree.jsもタイムライン編集を可能にするTheatre.jsが凄い ウェブサイトの演出を作る上でアニメーションの実装は欠かせません。一般的には、CSSアニメーションやJavaScriptのライブラリ(GSAPジーサップなど)を用いてコードベースで動きをつけることが多いと思います。ですが、完全にコードだけでアニメーションを調整するのは大変だと思ったことはないでしょうか? 一度実装したことがある方は共感いただけるかもしれませんが、少し直そうにもコードに戻って調整し、反映されたブラウザ画面を確認して、もう一度コードを直して…と往復していると結構大変です。また、アニメーションさせるプロパティや要素が複数ある場合には、コードを解読する難易度も上がります。 記事ではそんな悩みを解決できる、GUIからアニメーションを調整できるライブラリ「Theatre.jsシアタ

    デザイナーにもお勧め! CSSもThree.jsもタイムライン編集を可能にするTheatre.jsが凄い - ICS MEDIA
  • 「次にくるマンガ大賞 2024」受賞作品決定! コミックス部門第1位『カグラバチ』 、Webマンガ部門第1位『ふつうの軽音部』 | ダ・ヴィンチWeb

    コミックス部門の1位に輝いたのは、週刊少年ジャンプで連載中の『カグラバチ』。刀匠を志す少年チヒロにある日訪れた悲劇…‥。友情や裏切り、復讐と成長が交錯する物語が展開され、読者を引き込む壮大なアクションドラマ。ファンからは「読めばわかる。こいつはジャンプの看板になる」「あまりにカッコ良すぎて、作者は当にカッコいいを分かってると思う」といった声が多数寄せられました。 【コミックス部門TOP10】 1位 『カグラバチ』(外薗健/集英社) 2位 『魔入りました!入間くん if Episode of 魔フィア』(原案:西修 漫画:hiro者/秋田書店) 3位 『尾守つみきと奇日常。』(森下みゆ/小学館) 4位 『ドッグスレッド』(野田サトル/集英社) 5位 『COSMOS』(田村隆平/小学館) 6位 『超巡!超条先輩』(沼駿/集英社) 7位 『鵺の陰陽師』(川江康太/集英社) 8位 『のあ先輩はと

    「次にくるマンガ大賞 2024」受賞作品決定! コミックス部門第1位『カグラバチ』 、Webマンガ部門第1位『ふつうの軽音部』 | ダ・ヴィンチWeb
  • ラグジュアリーな生活をポストしてる人が物撮り背景この壁紙だとオッ虚構だなと思う「無課金標準壁紙さん」「耐久性やコスパで原点にして頂点」

    ハ木 @yagi_kachiku @shinoise 賃貸住んでる時、自分もそういう心配ほぼなかったけど入居した時に壁紙とか確認してる時5cm四方くらいで張替えしてあって、なるほどなーってなった

    ラグジュアリーな生活をポストしてる人が物撮り背景この壁紙だとオッ虚構だなと思う「無課金標準壁紙さん」「耐久性やコスパで原点にして頂点」
  • 実例で学ぶFlexboxとCSS Gridの使い分け – TAKLOG

    タイムラインを見ていると「flexとgridの使い分けがよく分からないよ」という人が多く散見されるので、今回は僕が普段意識していることを皆さんに紹介します。 これから紹介することはあくまで僕のやり方で、絶対的な正解とかではないので参考程度に留めておいてください。実装において頻出するレイアウトをサンプルに、どのように考えてレイアウトを組んでいけばよいかを自分なりに説明できたらなと思います。 はじめに僕がレイアウトを組む上で大事にしていること、および意識していること。それは、レイアウトに変化が起こった際に崩れが生じないことはもちろん、将来的な変更に対して柔軟に対応できることです。 極論を言ってしまえばgridは使わなくても大抵のレイアウトは組めてしまいます。Internet Explorerに苦しめられていたあの頃を思い出してみてください。現在でもgridは難解だからflexだけ使用するって方

    実例で学ぶFlexboxとCSS Gridの使い分け – TAKLOG
  • Next.jsの考え方

    Next.js App Routerにおける設計やベストプラクティスを、筆者なりにまとめました。

    Next.jsの考え方
  • 【AWS】 代表的なクラウドデザインパターン紹介

    はじめに AWSの豊富なサービス群を活用することで、高可用性かつ高スケール性を実現するシステムを構築することが可能です。 しかし、クラウドサービスの特性を最大限に活かすためには、適切なデザインパターンを理解し、実践することが重要です。そこで今回は、AWSを利用して「高可用性」かつ「高スケール性」を実現するための代表的なクラウドデザインパターンを紹介します。 1. EC2インスタンスを利用した動的コンテンツの配信 動的コンテンツとは? 動的コンテンツとは、ユーザーのリクエストに応じて生成されるコンテンツのことを指します。たとえば、ユーザーのログイン状況や入力内容に基づいて異なるページを表示するようなケースです。 AWSサービスの簡単な解説 Amazon EC2 (Elastic Compute Cloud): スケーラブルなコンピューティングリソースを提供するサービスです。必要に応じて、イン

    【AWS】 代表的なクラウドデザインパターン紹介
  • CSSレイアウト再入門:完全に理解してCSSを記述するために

    フロントエンドカンファレンス北海道2024 で発表させていただきました。 スライド中のリンク一覧

    CSSレイアウト再入門:完全に理解してCSSを記述するために
  • 独力でWebサービスを開発・構築できるフルスタックエンジニアへのロードマップ─幅広いスキルを「Udemy夏のビッグセール」で学ぶ! - はてなニュース

    Webで新規サービスを立ち上げる際に、UIからインフラ周りまで一人で面倒を見られるエンジニアは、少人数のスタートアップでなくとも非常に頼れる存在です。どんな課題に直面しても技術力で乗り越える、そんなスキルフルなエンジニアに憧れる方も多いでしょう。 この記事では、フロントエンドのプログラミング(JavaScript周辺)からサーバーサイド、インフラ、さらに開発手法まで、Web開発で必要になるさまざまなレイヤーのフルスタックなスキルの現在地と、関連するUdemyの講座を紹介します。 株式会社ヘンリーでVPoEを務める松木雅幸(@songmu)さんの執筆です。 フルスタックエンジニアに必要なスキル さまざまな講座でまとめて学習してみよう Udemyでは夏のビッグセールを開催中! ※この記事は、株式会社ベネッセコーポレーションによるタイアップ広告です。記事末に、はてなブックマークした方にAmazo

    独力でWebサービスを開発・構築できるフルスタックエンジニアへのロードマップ─幅広いスキルを「Udemy夏のビッグセール」で学ぶ! - はてなニュース
  • 可読性の高いコードを書くための実践ガイド - Qiita

    はじめに ソフトウェア開発において、コードの可読性はプロジェクトの成功に直結する重要な要素です。読みやすいコードは、メンテナンスや拡張を容易にし、チーム全体の生産性を向上させます。 しかし、「読みやすいコード」 の定義は人によって異なります。個々のスタイルや好みによって解釈が分かれることもあるでしょう。それでも、できる限り多くの人にとって理解しやすいコードを書くことが、プロフェッショナルとしての責任です。このガイドでは、そんな読みやすさを意識した具体的なテクニックなどを紹介していきます。「もう知ってるよ!」と思った方も、今一度できているかを確認してみてください。 弊社Nucoでは、他にも様々なお役立ち記事を公開しています。よかったら、Organizationのページも覗いてみてください。 また、Nucoでは一緒に働く仲間も募集しています!興味をお持ちいただける方は、こちらまで。 注意点 こ

    可読性の高いコードを書くための実践ガイド - Qiita