スタッフエンジニアの道 - Forkwell Library #66 での発表資料です https://forkwell.connpass.com/event/323138/ #Forkwell_Library
タグ検索の該当結果が少ないため、タイトル検索結果を表示しています。
CSSで三角を作る方法と言えば border でした。 私も三角を作りたい時は 「css 三角」 で検索、コピペして調整して作っていました。 ですが最近 clip-path というプロパティによってより分かりやすく三角が作れることを知ったので共有いたします。 ちなみに IE 以外では大丈夫そうです。逆を言うと IE 対応しなければいけない人は引き続き border で三角を作る必要があります。ここまでお読みいただきありがとうございました。 clip-path を使った三角の作り方 こう CSS を書くと .sankaku { background-color: blue; width: 16px; height: 20px; clip-path: polygon(0 0, 0% 100%, 100% 50%); } こうなります。 どこの点を結ぶかは clip-path で指定して、高さと
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
TL;DR 特に順番は気にしないとき path+=('/hoo/bar/baz'); 最初にいれたいとき path=('/hoo/bar/baz' $path) PATH通そうとして壊れるヤツ UNIXを使っている上で避けて通れないのが環境変数$PATHでしょう。 :区切りにディレクトリを列挙して、列挙されているディレクトリ直下に置かれているバイナリファイルをコマンドとして使えるようにするアレですね。 そんな$PATHに新しいディレクトリを追加しようとして、ついつい次のような事故がよく置きます。 export PATH="/hoo/bar/baz" こうしてしまうと最初から$PATHに設定していたデータが吹っ飛んで、PATHの中身が/hoo/bar/bazだけになってしまいます。こうなるとlsとかのコマンドが使えなくなる訳ですね。 zshだと$pathで配列として扱える この問題は何が原因
CSSのclip-pathプロパティは、非常に便利です。 セクションの区切りを斜めにしたり、ボタンに波紋のエフェクトをつけたり、スクロールして要素がビューポートに入った時にアニメーションで表示されたり、最近のWebページやスマホアプリで見かけるエフェクトはclip-pathプロパティを使用すると、簡単に実装できます。 clip-pathプロパティの基礎知識と便利な使い方、実装のポイントなどを詳しく解説します。 Understanding Clip Path in CSS by Ahmad Shadeed 下記は各ポイントを意訳したものです。 ※当ブログでの翻訳記事は、元サイト様にライセンスを得て翻訳しています。 はじめに clip-pathプロパティにおける座標 clip-pathプロパティに使用できる値 clip-pathプロパティを使用した実装 終わりに はじめに clip-pathプ
国内の個人開発者すずきすずぞう氏は、『Path of the Abyss』のSteamストアページを公開した。ストアページによると、ゲーム内は日本語および英語表示に対応。ストアページにあわせて、PVも公開されている。また同氏のTwitterやpixiv FANBOXでは、開発中の情報などが公開されている。 『Path of the Abyss』は、リアルタイムな戦闘システムを搭載したダンジョン探索RPGである。本作の舞台は、東ウェルトデンなる地域に存在する小さな遺跡だ。遺跡では、かつて盗掘が繰り返されていたが、最近では誰の目にも留まらず、静かに朽ち果てようとしているかに思われていた。 ある時、遺跡内で恐ろしいモンスターが目撃される。噂話だと侮った冒険者や、領主が結成した調査隊が遺跡を訪れるが、いずれも無残な結果に終わってしまう。そして、遺跡の噂を聞きつけた腕に覚えのある冒険者たちが、東ウェ
HTMLはdiv要素一つだけ(もしくはimg要素一つだけ)、あとはCSSをコピペするだけで三角形を実装できるCSS Triangle Shapesを紹介します。 CSSの三角形は、一昔前はborderで実装していましたが、最近では2つのプロパティ(aspect-ratio, clip-path)で実装します。どうやって実装するんだっけ? というときに覚えておくと、さくっと利用できるので便利です。 CSS Triangle Shapes CSSで三角形を実装する最近の方法 CSSで三角形を作成するジェネレター CSSで三角形を実装する最近の方法 まずは、三角形をCSSで実装する方法を見てましょう。 これまでのCSSだと、divなどの矩形にborderプロパティで太いボーダーを設定し、三角形の部分だけ残して使用していました。
何だと!? タイトルのまんま。 恥ずかしながらこれ今まで知らなかった。 もしかして常識だったりする? ちなみに確認したのは Linux だけど、glibc の posix サブディレクトリ配下の execl*execvpe の挙動なので glibc 使ってればみんな一緒じゃないかな?知らんけど… 環境変数 PATH が設定されていない時 unset PATH とした状態。 この場合、PATH=/bin:/usr/bin と設定されているのと同じ意味になる(追記も参照のこと)。 当然カレントディレクトリは含まれていない。 環境変数 PATH が空の時 PATH= とした状態。 「PATH 環境変数が設定されていない時」とは異なる事に注意。 この場合、PATH=. と設定されているのと同じ意味になる。 つまり、カレントディレクトリが含まれている。 環境変数 PATH の最後が : で終わってい
以下の記事を読みました。 CookieのPath属性は本当に安全性に寄与しないのか 結論として以下となっています。 結論。Path属性は特殊な状況下ではある程度安全性に寄与する Path属性は、これを設定してCookieを発行するあるパス(以下「自身のパス」)にサーバサイドのプログラムを書き換えられるような脆弱性がなく、同一オリジン内の別のパスにそのような脆弱性がある場合に、そのパスへのCookieの漏洩することを防ぐことができます。 中略 つまり、「体系的に学ぶ 安全なWebアプリケーションの作り方」の記述はおそらく間違えです。 とはいえ私はセキュリティは専門ではなく、特に攻撃側には疎く、この記事に書いた以上の調査・実験もしていないため、この結論も確実とは言い切れません。詳しい情報をお持ちの方がいたら、ぜひご教示ください。 記事では、iframeなどを用いた攻撃について言及されていて、そ
ファイル操作って何となく難しいって思いませんか? 何かミスをするとファイルが壊れちゃうんじゃないか? って思ったことありますよね。でも、大丈夫です。Pythonにはファイルを扱う方法がいろいろと用意されているんです。もちろん、失敗すればファイルが壊れることはありますが、そうはならないような方法もちゃんと用意されていますから。 例えば、C言語ライクなopen関数でファイルをオープンし、必要な処理をしてから、closeメソッドでファイルを閉じる方法。with文を使ってオープンしたファイルを必ず閉じるようにする方法(この方法ならファイルが壊れる恐れは格段に減るでしょう)。それから、pathlibモジュールのPathクラスが提供するread_text/read_bytes/write_text/write_bytesの各種メソッドを使う方法。Pythonに標準で付属の各種モジュールを使う方法。ch
管理画面の時だけ認証をかけたいみたいな要件はよくある。今回はその要件をALBで特定のpathの時だけCognito認証を通すという構成で実装してみたのでメモ。構成はaws-cdkを使った。 やりたいこと /admin/以下の場合はCognitoの認証をかけ、許可したユーザーしかアクセスできないようにする それ以外のパスではアプリケーションに認証なしで繋がるようにする 実装 aws-cdk 1.62.0を使って実装した。なお今回のコードは実際の実装をミニマムに変更しているので、動作確認はちゃんと出来ていない(たぶんそのままだと動かなそう)。雰囲気だけ感じてください。 import { IVpc, Port } from "@aws-cdk/aws-ec2"; import { Ec2Service } from "@aws-cdk/aws-ecs"; import { Application
CSSのclip-pathを使うと要素を好きな形に切り抜けます。コンテンツを斜めに切り抜いたり、画像を丸く切り抜いたり、おそらくみなさんも見たことがある表現なのではないでしょうか? clip-pathでは形を切り抜くための関数が利用できます。2025年4月ごろにリリースされたChrome 135、Edge 135、Safari 18.4にはshape()関数が追加されました。shape()関数を使うとより自由度の高い切り抜きが可能になります。 今回の記事ではclip-pathとshape()関数でどんな表現ができるかをご紹介します! clip-pathとは まずはclip-pathについて簡単に確認しましょう。 冒頭でも紹介した通り、clip-pathでは要素を切り抜くためのクリッピング領域を作ります。circle()、rect()、path()、polygon()などの関数を使うことで、
「UXは、今や一つのコミュニティ、あるいは一つの手法で捉えられないほど、大きな存在となった」 そう、UXの現在地を語るのは、Jesse James Garrett氏。2001年にデザインエージェンシーAdaptive Pathを共同設立。著書『The Elements of User Experience』で提唱した「UXの5段階モデル」でも知られる。 業界の先駆者は、Fast Companyに寄稿した記事『I helped pioneer UX design. What I see today disturbs me』のなかで「私たちは一体どこで道を間違えたのか」を厳しく問う。率直な思考が綴られた記事を、公式に許可をいただき翻訳した。 20年前、UXデザインが研究所を飛び出し、本格的な産業へと発展し始めたとき、未来はとても眩しかった。一握りの専門家の漠然とした関心事から、何千人もの増員を
■ macOS でシステムレベルで環境変数を設定したい vscode やその他の開発に関係するアプリケーションを使う時に、いわゆるターミナルとシェルの上で動かすことで任意の環境変数を渡せるというのは当たり前の話なのだが、これをターミナルやシェルを経由しないで動かした時も反映させたくて、いい感じの方法はないものか、と探していてやっと解決方法を見つけた macOSでGUIアプリの環境変数を設定する方法探求 - Qiita というのも vscode で rust や go, rbenv を使うときに上記のような環境変数を設定したくて、いつもシェルから起動しているんだけど、アップデートで再起動を押すとシェルをスキップして起動して何かしらのプラグインがエラー、とか $HOME の下に go ディレクトリとかをばら撒くということがあってなんとかしたいのだった。 launchctl を使う方法は以前も見
Russ Cox 19 January 2021 Today’s Go security release fixes an issue involving PATH lookups in untrusted directories that can lead to remote execution during the go get command. We expect people to have questions about what exactly this means and whether they might have issues in their own programs. This post details the bug, the fixes we have applied, how to decide whether your own programs are vu
サービス開始から約10年,「Path of Exile」がついに日本語をサポート 編集部:松本隆一 ニュージーランドのGrinding Gear Gamesが開発・運営を行う「Path of Exile」の最新パッチ“3.19.2b”で,日本語サポートが追加された。本日(2022年12月2日),公式サイトのフォーラムで報告されている。 「Path of Exile」日本語公式サイト 2013年10月にリリースされた「Path of Exile」は,基本プレイ料金無料でありながらシングルプレイがたっぷり楽しめるビジネスモデルなどからスマッシュヒットを記録したハック&スラッシュタイプのアクションRPGだ。膨大に用意されたコンテンツも人気の理由で,プレイヤーは,ダークファンタジーの世界を舞台に,自由な冒険ができる。 中毒性も高く,リリースから約10年を経た今年2月には,正式サービス開始以降最高と
We developed the Privacy Sandbox with the goal of finding innovative solutions that meaningfully improve online privacy while preserving an ad-supported internet that supports a vibrant ecosystem of publishers, connects businesses with customers, and offers all of us free access to a wide range of content. Throughout this process, we’ve received feedback from a wide variety of stakeholders, includ
This blog tries to summarize all the choices and paths you could take to implement your next programming language, more specifically the frontend for your language. There are a lot of factors that will influence your choices. Maybe you have your favorite host language that you would like to use for implementing your language, whether your language is dynamically or statically typed, or you are des
インディーデベロッパーのCaptilightは11月4日、探索型パズルゲーム『Path of Kami: Journey Begins』の最新トレイラーを公開。PC(Steam/itch.io/GameJolt)向けに、現地時間11月9日発売すると発表した。Steamストアページでは、日本時間11月10日の配信と表記されており、ゲーム内は日本語表示にも対応する見込み。本作は各プラットフォームにおいて、無料デモ版を配信中だ。 『Path of Kami: Journey Begins』は三人称視点で描かれる探索型パズルゲームだ。本作の主人公は、亡くなったニホンオオカミのカゼヨ。プレイヤーはカゼヨを操作し、カゼヨの魂を黄泉の国へと誘うため、相棒の精霊とともに数々の試練を乗り越えていかなければならない。試練はパズル形式で出題され、プレイヤーは灯篭に火を灯すなどのアクションでパズルを解いていくよう
Tracing the path of network traffic in KubernetesJanuary 2022 TL;DR: In this article, you will learn how packets flow inside and outside a Kubernetes cluster. Starting from the initial web request and down to the container hosting the application. Table of ContentsTable of ContentsKubernetes networking requirementsHow Linux network namespaces work in a podThe pause container creates the network na
The Architect’s Path (Part 2 - Bookshelf) Growing an architect is different from growing a system. This bookshelf will help. I help enterprises with their architecture strategy and cloud transformation journey by connecting the penthouse with the engine room. Ex-Google, Allianz, ThoughtWorks, Deloitte. Updated: November 17, 2020 Category: Architecture Part 1 of this mini-series contemplated an arc
See the discussion of this post on Hacker News. My wife and I decided to make an 8-bit, top-down, Zelda-like game written for the PPU466 (from CMU 15-466 Computer Game Programming course). The PPU466 is a graphics API kind of like the PICO-8 fantasy console, in the sense that it’s restricted to 8-bit graphics, 4 colors per tile, fixed backgrounds, and a low number of sprites. As a part of the game
モデル予測経路積分制御 (Model Predictive Path Integral Control; MPPI) 入門 本記事は名古屋大学の本田康平(https://kohonda.github.io/ )による寄稿です. はじめに ロボットの制御や運動計画で人気を博しているモデル予測制御 (MPC) ですが,MPCの中でもサンプルベースMPCは手頃に実装できる上に,性能もそこそこ良いため非常に使い勝手が良いです.サンプルベースMPCとは,有限時間将来までの制御入力のサンプルを複数用意して,それらを制御対象の予測モデルを用いて未来の状態を予測・評価して,制御入力を決定するというものです.これらは予測モデルやコスト関数が微分不可能であったり非線形性が強い場合でも利用できるので,とても使い勝手が良く,モデルベース強化学習などでもしばしば利用されます. 近年,サンプルベースMPCに対して確率
※ただし IE は除く 問題 今までのフロントエンドの悩みの一つに、 publicPath の設定がありました。これはchunkを含むビルドした際に、chunk を解決するホストを明示的に指定する必要がある、というものです。 例えば、 https://cdn.example.test/assets/module.js に静的ファイルを配置する際、 publicPath として https://cdn.example.test/assets/ を指定する、という必要がありました。これはレガシーブラウザ環境だと module.js が自分自身がどのようなパスとして実行されているからわからず、相対パスのファイルのパスを知る方法がなかったのでビルド時に指定する必要があったわけです。 解決方法 現在、ESM なら import.meta.url、 <script src="..."></script
We developed the Privacy Sandbox with the goal of finding innovative solutions that meaningfully improve online privacy while preserving an ad-supported internet that supports a vibrant ecosystem of publishers, connects businesses with customers, and offers all of us free access to a wide range of content. Throughout this process, we’ve received feedback from a wide variety of stakeholders, includ
Select a learning path Your one stop to build marketable skills through labs, courses, and learning paths. When you're ready, prove you know your stuff by earning a skill badge that you can share on social media and hiring platforms like LinkedIn and Credly. Create an account today and start learning Generative AI through a new free-of-cost learning path - Beginner: Introduction to Generative AI!
Grinding Gear Games(以下、GGG)は4月8日、基本プレイ無料のハクスラARPG『Path of Exile』にて、新拡張コンテンツ「Crucible」を配信開始した。本作では拡張コンテンツ配信のたびにSteam同時接続プレイヤー数が大幅増加するのが慣例となっている。しかし、今回本作は、最大同時接続プレイヤー数記録を更新している。 『Path of Exile』は、GGGが手がけるハクスラARPG。PC向けを中心に、長年にわたり高い人気を誇っている。また、昨年末にはリリースから約9年越しに正式日本語表示対応を果たし、国内ハクスラファンから喜びの声もあがった(関連記事)。本作では、「リーグ」と呼ばれる区切りにて、定期的な拡張コンテンツの無料配信がなされてきた。そうした拡張配信のタイミングでは人口が爆発。一定期間をおいて落ち着くサイクルを繰り返し、のこぎりの刃のような特徴的な
Last week, we presented in Rails World an upcoming addition to Turbo that uses morphing to offer smoother page updates and a simplified broadcasting system. This is the article version of the presentation I delivered. The starting point The traditional server-side full-page programming model that Rails nailed twenty years ago is incredibly productive. It lets you think of your application as a set
背景 FastAPIでは以下のようにデコレータ関数を使うことでHTTPサーバのpathを設定することができ、これをPath Operationと呼びます。 from fastapi import FastAPI app = FastAPI() @app.get("/") async def read_root(): return {"Hello": "World"} @app.get("/items/{item_id}") async def read_item(item_id: int, q: str = None): return {"item_id": item_id, "q": q} このPath Operationでdefを使うべきかasync defを使うべきかの方針を説明します。 環境 Python 3.9.11 FastAPI 0.74.1 方針 結論から言うと以下の方針で
ホーム ニュース ハクスラARPG『Path of Exile』Steam同時接続者数が約1万から約16万に一気に爆増。大型アプデに、一部日本語対応も 基本プレイ無料のハクスラARPG『Path of Exile』が2月4日、Steamにて「約1万人のピーク同時接続者数が、翌日には約16万人になる」という爆発的な人口増加を記録。そして最高ピーク同時接続者数を記録した。その背景には、大型アップデートに伴う本作の特徴的な人口推移がある。また、その直前には本作が“ひっそり”一部日本語対応したことが明らかになっている。 『Path of Exile』は、ニュージーランドを拠点とするスタジオGrinding Gear Games(以下、GGG)が手がけるハクスラARPGだ。国内外のハクスラファンからの支持も根強く、日本語未対応ながら国内にも少なくないプレイヤーがいる作品である。本作は2013年に配信
AI & MLLearn about artificial intelligence and machine learning across the GitHub ecosystem and the wider industry. Generative AILearn how to build with generative AI. GitHub CopilotChange how you work with GitHub Copilot. LLMsEverything developers need to know about LLMs. Machine learningMachine learning tips, tricks, and best practices. How AI code generation worksExplore the capabilities and be
In the early days of high-performance computing, the major tech companies of the day each invested heavily in developing their own closed source versions of Unix. It was hard to imagine at the time that any other approach could develop such advanced software. Eventually though, open source Linux gained popularity – initially because it allowed developers to modify its code however they wanted and
The styled-components Happy PathMy personal suite of “best practices” Filed underCSSoninJanuary 25th, 2021.Jan 2021.Last updatedoninNovember 17th, 2024.Nov 2024. For a few years now, my #1 favourite tool for managing CSS in React apps has been 💅 styled-components. It's a wonderful tool. In many ways, it's changed how I think about CSS architecture, and has helped me keep my codebase clean and mod
CSS clip-path や mask-image の仕様などについては以下のサイトで確認することができます。 CSS Masking Module Level 1(日本語訳) CSS Masking Module Level 1(W3C) CSS Shapes Module Level 1(日本語訳) CSS Shapes Module Level 1(W3C) MDN CSS マスク 以下で clip-path や mask-image 関連のブラウザの対応状況を確認できます。 can i use: clip-path can i use: mask-image 関連ページ: HTML SVG の基本的な使い方 SVG アニメーション(SMIL を使ったアニメーション) Photoshop で SVG CSS マスキング mask-image の使い方 CSS Shapes / sh
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く