TechVue3 + TypeScript で Vite4 環境変数を用いる方法 Vue3プログラムで必要な変数を外部ファイルから取得する方法を、Viteの環境変数を使用した具体例を交えて解説します。環境変数を用いることで、APIキーやパスワードなどの機密情報を安全に設定することができます。本記事では、Viteにおけるモードの理解やビルトイン環境変数の設定、独自の環境変数の作成方法、そして作成した環境変数の参照方法についても解説します。2023.04.182023.04.28TechVue.jsJapanese
TechVue3 + TypeScript で Mapbox GL JS を使って マップ を レスポンシブ に画面全体に表示 Vue3, TypeScript 環境 で Mapbox地図をレスポンシブ表示する方法を紹介しています。 主にCSSの設定が参考になれば幸いです。2023.03.202023.04.03TechVue.jsJapanese
JapaneseFigma Lessons: 03 Design thinking & ethics – デザイン思考と倫理 本記事では、デザインをする際に重要になってくる「 Design thingkin - デザイン思考」という考え方と、デザインする際に気にしておくべき「ethics - 倫理」について整理していきます。 デジタルプロダクト の デザイン をす...2023.03.152023.05.26JapaneseDesign
JapaneseFigma Lessons: 02 What is graphic design? (グラフィック デザイン とは何か?) 本記事では グラフィック デザイン とは何か? について整理していきます。 得てして、グラフィック を可愛らしくすることが デザイン だと思われていますが、 その誤りについて例を用いて説明していきます。デザインとはものごとをカッコよく見せる...2023.03.01JapaneseDesign
DesignFigma Lessons: 01 Getting Started (さあ始めよう) 最初のレッスンは、Getting Started ということで、この Figma Design Learning Program を通じて何を学ぶことができるかの紹介と、Figma 製品の簡単な紹介で構成されています。Figma Desig...2023.03.012023.04.03DesignJapanese
Japanese[シリーズ] Figma Design Learning Program を用いて Design を学習し、Figma を使って プロトタイピング をする Motivation近年 プロダクト を開発する際に リーン に始める方法が紹介されている 書籍 や 情報 を目にするようになりました。 "リーン に始める" とは、とても簡略化していうと、以下のような段取りで プロダクト を開発し、世に ...2023.03.012023.03.15JapaneseDesign
Tech[WordPress] プラグイン を使って 投稿 を “連載” シリーズ として公開する方法 本記事では、プラグイン を用いて WordPress での投稿を ”連載” シリーズ として公開する方法を紹介します。 プラグイン の設定についても スクリーンショット を用いながら実際の設定を交えて紹介しています。2022.07.242023.01.25TechWordpressJapanese
TechWordPress で Discussion セクション を再表示する方法 WordPress の 各投稿の設定の一つである Discussion について、 設定変更しようとしても 稀に Discussion セクション が表示されていないことがあります。今回の記事では 消えてしまった Discussion セクション を再表示する方法について紹介していきます。2022.07.202023.01.25TechWordpressJapanese
Vue.jsVue3 + TypeScript 開発環境で 環境変数 を利用する方法 (.env ファイル) Vue.js アプリケーション を開発するにあたり、 パスワード や API Key といった 慎重に取り扱うべき データ を用いる局面が多々あります。 本記事では Vue3 + TypeScript + Vite 環境 で 環境変数 を用いることで この問題に対処する方法を紹介していきます。2022.04.272023.04.18Vue.jsJapaneseTech
TechVue3 + TypeScript プロジェクト から Firestore に接続する サンプル Vue3 + TypeScript プロジェクト で Firebase の リアルタイム DB である Firestore に アクセス して データ を取得する サンプル を紹介します。 本記事では、事前に Firestore に格納しておいた データ を Vue アプリケーション で表示してみようと思います。 なお、 今回は例として、開発環境で実装していきます。2022.04.262022.07.20TechVue.jsGCP-FirebaseJapanese