2022.12.14 WEBシステム開発 安全性、速度、並行性を兼ね備えた言語と、巷でうわさの「Rust」を覗いてみる（その6：参照と借用） みなさまごきげんよう。 今回も「The Rust Programming Language」を読みながら、 参照と借用についてみていきたいとおもいます。 参考 https://doc.rust-lang.org/book/ https://doc.rust-jp.rs/book-ja/ （日本 [...]
2022.11.30 BUSINESS仕事効率化ツール chromeで開いたタブのURLをまとめてコピー&ペーストできる拡張機能、「Copy All Urls」の使い方 webブラウジングをしていると気が付いたらたくさんのタブを開いていることはありませんか？ 著者は仕事柄、webブラウザを利用して多くのサイトを閲覧していますが、後でゆっくり確認したいページや気になったページはとりあえず残したまま、どんどん新しいタブでページを開いていく癖があります。 気が付いたらタ [...]
2022.11.28 WEBWebデザイン Illustratorで「矢印」を作る！ Photoshopへのコピペ方法も解説します。 図解などを作成する際によく使われる矢印。 今回は Illustratorで様々な形の矢印の作り方をご紹介します。 シンプルな直線矢印 まずはシンプルな直線矢印から、応用として曲線矢印の作り方をご紹介していきます。 ①ペンツールで線を引きます。 始点をクリックし、[Shift]キーを押しながらマ [...]
2022.11.28 BUSINESS仕事効率化ツール Google Dictionaryという単語や語句の意味を教えてくれる拡張機能を⾒つけたので、使ってみた。 以前の記事で書いた「Google翻訳」の拡張機能と似ている「Google Dictionary」というwebサイト上にある単語や語句の意味を教えてくれる拡張機能を⾒つけたので、早速使ってみました。 以前の記事Google Chromeの拡張機能にある「Google翻訳」を使ってみたら非常に便利だ [...]
2022.11.16 WEBアクセス解析 無料でヒートマップ分析やサイトのレコーディングができる、Microsoft Clarityの使い方・導入方法 webサイトの分析を行うためにGoogleアナリティクスを使用している方は多いと思います。 しかしGoogleアナリティクスではサイトのアクセス数やユーザーの遷移、コンバージョンの経路などの確認はできますが、ユーザーが実際にどのような操作でwebサイトを使用しているかを分析するには不向きです。 ユ [...]
2022.11.15 WEBシステム開発 【Vue.js】ドラッグ＆ドロップでアップロードした画像をプレビュー表示してみる 最近、 input type=”file” を使った画像をアップロードと、アップロードした画像のプレビューを実装する機会がありました。 そこで今後のために、 input type=”file” だけでなく、ドラ [...]
2022.11.14 WEBシステム開発 Visually Hiddenパターンでアクセシビリティに配慮したマークアップを意識する React Testing Library や Chrome の開発者ツールでアクセシビリティツリーが見えるようになるなど、最近はただ見た目通りにマークアップするだけではなく、アクセシビリティに配慮したマークアップも必要なスキルセットになってきている流れを感じます。 筆者といえば、最近HTMLやC [...]
2022.11.07 WEBWebデザイン デザインでよく見る“あしらい”をIllustratorで簡単に作ってみよう デザインにおいての「あしらい」とは、「装飾」や「ディテール（細部）」のことを意味します。 例えば、見出しのフレームや帯、下線などの飾りや、イラストや文字の加工、背景のテクスチャー等もあしらいに含まれます。絶対に必要なものではないですが、あしらいを施すことによってサイト全体の雰囲気を演出することがで [...]
2022.11.07 WEBWebデザイン ブラウザ上でガイドを表示できる！ピクセル単位でのサイズ計測ができる！Chrome拡張機能「Grid Ruler」 様々なwebデザインの参考サイトを確認する際、「このサイズをまねしたいけど何ピクセルなのだろう」「このフォントサイズはいくつなのだろう」と思うことはありませんか？ webサイトデザインは基本的にサイズの単位が「ピクセル」であり、一般人にとっては目視ではかるのはなかなか困難です。 また、webサイト [...]
2022.10.31 WEBWebデザイン 【canvas入門】canvas要素の線や塗りのスタイルを変更しよう！ 前々回（canvas要素とは？HTMLとJavaScriptを使って図形を描いてみよう！）と前回（【canvas入門】HTMLとJavaScriptを使って図形を描いてみよう！（曲線編））の記事でcanvas要素において図形やパス、曲線などの描き方をご紹介しました。 今回はその図形や線に対して、色 [...]
2022.10.24 WEBシステム開発 GraphQLサーバを構築するためのGoライブラリ「gqlgen」を使ってGraphQLサーバーを構築してみる こんにちは！ 今回はGoでGraphQLサーバーを作ってみたくなったのでgqlgenを利用してGraphQLサーバーを構築してみます。 GraphQLとは GraphQLは、APIのためのクエリ言語であり、データに対して定義した型システムを使ってクエリを実行するためのサーバーサイドランタイムです [...]
2022.10.21 WEBシステム開発 安全性、速度、並行性を兼ね備えた言語と、巷でうわさの「Rust」を覗いてみる（その5：所有権と関数） 今回も「The Rust Programming Language」を読みながら、所有権と関数を覗いていきたいと思います。 参考 https://doc.rust-lang.org/book/ https://doc.rust-jp.rs/book-ja/ （日本語） 過去の記事 安全 [...]
2022.10.12 WEBWebデザイン Illustratorのレイヤー整理術！レイヤーを美しくして作業効率を上げよう！ 前回の記事「Photoshopのレイヤー整理術！レイヤーを美しくして作業効率を上げよう！」では、Photoshopのレイヤーを整理することは重要であると解説しました。 Photoshopと同じAdobe製品のIllustratorにも、レイヤーの概念は存在します。 しかし、Photoshopとは少 [...]
2022.10.12 WEBソーシャルメディア 簡単にできる！Twitterのツイートとタイムラインをホームページに表示させる方法 近年業種や組織の規模に関わらず、SNSを利用して情報発信をする組織が多く見られます。 数あるSNSの中でもTwitterは拡散力が高く情報発信に適しており、Twitterとホームページを両方運営している組織であれば、Twitterをホームページに表示させることでホームページからのフォロワー獲得や最 [...]
2022.10.06 WEBWeb全般 【2022年9月現在】Google Chrome、Microsoft Edge、Firefox、Safari・・・ブラウザ別にバージョンの確認方法をご紹介 いろんなWebサイトを見る際に、表示の崩れが起きることはありませんか？ それはもしかしたらブラウザのバージョンが最新版ではないからかもしれません。 様々なサイトを確認する際、「このサイトについて」などのページの中に、「推奨環境」が書かれている場合があります。 多くの場合「Google Chrome [...]
2022.09.27 WEBシステム開発 Webアプリケーションの構造を理解し、dockerを用いた開発環境を構築できるようになる（構築編） 前回の知識編では、webアプリケーションの構造を理解すること、そしてそれを理解した上でdocker・docker-composeとはどんなものかを改めて理解することが目的でした。 今回の構築編では、実際にdockerを利用して弊社で用いる開発環境を構築していきたいと思います。 前提 Apac [...]
2022.09.26 WEBWebデザイン CSSの新機能「カスケードレイヤー」を使ってもっと簡単にスタイルを管理しよう web制作の現場においてCSSでのスタイリングは欠かせないものですが、意図した装飾とならずに困った経験がある人は多いのではないでしょうか？ CSSのスタイリングを適用する際には、詳細度や記述の順番を考えてコーディングを行う必要がありますが、新しい機能として「カスケードレイヤー」が利用可能になりまし [...]
