Vue.js 3 入門 「Vue CLI のセットアップ」 - Qiita
はじめに Vue.js で作成するアプリケーションのテンプレートを自動生成してくれる Vue CLI というコマンドラインツールのセットアップから、プロジェクトの生成、アプリケーションの実行までの手順を記載しています。 Vue.js 3.x を前提としています。 Node.js のインストール Vue CLI を利用するには、Node.jsが必要です。 既にNode.jsをインストール済みの方は飛ばしてください。 インストーラーを起動 以下のリンクからNode.jsのインストーラーをダウンロードして実行します。 https://nodejs.org/ja/ 「Next」をクリック 「I accept the terms in the License Agreement」にチェックを入れて「Next」をクリック 任意のインストール先を指定して「Next」をクリック デフォルトのままで「Nex
垂直方向のマージンにはmargin-topを優先的に使う理由
margin-bottomではなくmargin-topを使う派である旨をツイートしたら理由を尋ねられたので、それに対する回答です。大きくは次の3つです。 末尾の要素の存在が任意である場合が多いため Stackレイアウトとの取り合わせやすさのため 隣接セレクターを使った場合分けができるようにするため CSS、基本コンポーネントの上にマージン取る派と、下にマージン取る派がいると思うですけど、自分は今までずっと下で。というのは、その方が直感的だと感じるからなんですけど、見出しの下って結構縮めるよね？それを上マージンでやると結構頭こんがらがらない？って思うんだけどどうなんだろう — Takazudo (@Takazudo) January 12, 2021 上です — 全部入りHTML太郎 (@_yuheiy) January 12, 2021 なぜですか? — u (@uknmr) Januar
Autolinkerでテキスト内のURLなどをリンクに変換する(Javascript) | バシャログ。
どうもfujiharaです。本日はテキストで記載れたURLなどをリンクタグに変換してくれる便利なAutolinkerを紹介します。 Autolinker.js テキストエリアで入力されたURLなどを自動でリンクにするために npmで探していたら出会いました。 Autolinker.js はURLだけでなく他にも色々変換してくれます 使い方 以下のようにAntolinker.link('変換対象', option) で変換してくれます。 <div id="before-link"> URL: https://c-brains.jp<br> Mail: mail-check@test.mail.com<br> Tel: 0120-000-9999<br> Mention: @matsu_bouzu<br> HashTag: #コロナ </div> <script src="https://cd
CSSのボックスモデルの構造をCSSアニメーションで可視化
@use postcss-preset-env { stage: 0 } .stack { display: grid; grid: [stack] / [stack]; perspective: 5000; &:before { content: ""; position: fixed; inset: 0; background: lch(95 0 0); transition: background 2s ease; pointer-events: none; } &:matches(:hover, :active) { &:before { background: lch(15 0 0); } } &:matches(:hover, :active) .card { --bg-opacity: 5%; transition-duration: 2s; transition-timin
ブラウザで処理するプライバシーに配慮したオープンソースのJPEG最適化ツール・「JPEG.rocks」
JPEG.rocksはブラウザで処理するプライバシーに配慮したオープンソースのJPEG最適化ツールです。サーバーに送信しない、WebAssemblyを使用したブラウザベースのJPEGオプティマイザで、利用者のプライバシーに配慮した設計となっています。 OSSとしてソースコードも公開されているので自身で利用する事もソースを確認する事も可能です。Google推奨のおかげか、世間はWebPに移行しつつあるのかもしれませんが、すぐにJPEGが無くなるわけでもないでしょうし、この手のツールもまだ需要はありそうですね。 オープンソースである事は開発者も明示しているのですが、ライセンスは不明です。利用したい場合は開発者にお問い合わせください。 JPEG.rocks
)
OpenMTP - macOS用のAndroidファイル転送ツール
Androidからファイルを送受信する方法は面倒なイメージがあります。Android File TransferはあまりこなれたUIではありません。共有機能もありますが、ローカルにあるデバイス間でファイルを授受するのにインターネットを介するのは面倒です。 そこで使ってみたいのがOpenMTPです。AndroidとmacOS間のファイル送受信ソフトウェアです。 OpenMTPの使い方 設定です。ダークモードや隠しファイルの表示設定などが変更できます。 二画面ファイラーのようなUIです。 なお、筆者環境ではファイルのブラウジングはできるものの、送受信はできませんでした。UIはとても見やすいので残念です。安定してファイルの送受信ができるようになれば、Android用のファイラーとして便利そうです。 OpenMTPはmacOS用のオープンソース・ソフトウェア（MIT License）です。 gan
VS Code & TypeScriptとp5.jsで始めるモダンなクリエイティブコーディング入門 - ICS MEDIA
ページの背景で動くダイナミックなパーティクルやラインアニメーション、あるいはちょっとした遊びごころの溢れるキャラクターアニメーションなど、webページにクリエイティブな表現を組み込めるようになりたいと考える方はエンジニアにも多いでしょう。 この記事では、基本的なJavaScriptの知識があれば誰でも始められるp5.jsというライブラリを使用して、クリエイティブな作品作りの入門を解説します。 環境面では、フロントエンド開発のデファクト・スタンダードとも言えるVisual Studio Code（以下VS Code）とTypeScriptを使用して、モダンで快適な開発環境を作ります。 環境構築といっても、とくに難しい作業はありません。記事を読みながらぜひ、オリジナルの作品作りにチャレンジしてみてください。 ▼ VS Codeでp5.jsを使って制作している環境の例 クリエイティブ・コーディン
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
