OpenWeatherMap APIで天気情報を取得する(Vue.js)
OpenWeatherMapのapiで過去、現在、未来予測の天気の情報を取得することができます。
無料から使い始めることができる点でも使いやすいです。
Vue.jsでOpenWeatherMapで天 ...
QuasarのIcon Genie CLIのインストール方法とよく使うオプションについて
QuasarのIcon Genie CLIを使うとアイコン(ファビコン)をデスクトップ、macandroid、iphone用に一括して作成することができます。Icon Genieのインストール方法、アイコン(ファビ ...
Vue2でタブとモーダルを作成する方法(Bulmaフレームワーク)
Vue2でタブとモーダルを作成する一例を紹介します。
Vue2でBulmaのcssフレームワークを使ってタブとモーダルを作成します。
Firebase+Vue.js(Vue3 Composition API)でログイン/サインアップフォームを作成する
Firebase+Vue.js(Vue3 Composition API)でログイン/サインアップフォーム作成する方法です。
JavaScriptでパスワードベースのアカウントを使用してFirebase ...
Vue 3 Composition APIでasync-awaitを使う方法
Vue 3から導入されたComposition APIでasync-awaitを使う方法をまとめました。
async-await自体の使い方は、こちらの記事を参考にしてみてください。
JavaScr ...
Vue 3 Composition APIの基本的な使い方
Vue 3から新しく導入されたComposition APIの基本的な使い方をまとめました。
Vue 3 Composition APIの基本的な使い方Options APIとComposition APIの ...Vue.js v2でTODOアプリ(CRUDシステム)を作成する
Vue.jsでTODOアプリ(CRUDシステム)を作成する方法を紹介します。
Vue.jsでTODOアプリ(CRUDシステム)を作成するプロジェクトの構成プロジェクトの構成は次のようになっているとします ...
Vue.js v2のslotの使い方
Vue.jsのslotの使い方をまとめました。
slotの基本的な使い方親コンポーネントApp.vue親コンポーネントのtemplateタグの中に次のように記述します。
<template& ...Vue.js v2のteleportの使い方
Vue.jsのteleportの使い方をまとめました。
teleportの使い方teleportを使うことで、index.htmlでmountしている場所と異なる場所に指定したコンポーネントを出力するこ ...
Vue.js v2でリアクションタイマーを作成する
Vue.jsでリアクションの時間を図れるタイマーを作成します。
Vue.jsでリアクションタイマーを作成する親コンポーネントApp.vueに加えて、子コンポーネントBlock.vue
子コンポー ...
Vue.js v2のrouterの基本的な使い方
Vue.jsのrouterの基本的な使い方をまとめました。
routerの基本的な使い方Vue CLIでrouterをインストールすると、次のようにpackage.jsonのdependenciesに追 ...
Gitでコミットせずに一時保存するgit stashの使い方
作業が途中でコミットしたくないけど、別のブランチで作業しないといけないといったことが起こります。
そういうときに変更途中のものをコミットせずにいったん保存して一次避難させることができます。
JavaScriptのオブジェクトの操作方法
JavaScriptのオブジェクトが使えるようになると、いろんなことができるようになります。
そもそもオブジェクトはなぜ使うのか、どうやって使うのかを学んでいきましょう。
CSSでリストをスタイリングする方法
リストのスタイリングが少し違うだけでかなりおしゃれに見えたり、独自性を出すことができます。
CSSでリストをスタイリングする方法をみていきましょう。
リストを ...
CSSのHSLで色指定すると統一感のある色表現が簡単にできる
HSLで色指定すると、とても簡単に統一感のある色表現を実現できます。
具体的な例とそのやり方をみていきましょう。
バックグラウンドの背景色は、
CSSの色の指定方法とそれぞれのメリット・デメリット
CSSでは、いろいろな色をいくつかの方法で表現することができます。
それぞれメリット・デメリットがあるので、その方法と具体的な使い方をみていきましょう。
CSSの色の指定方法CSSで色を指定 ...
CSSで垂直方向に文字や画像を揃える方法
CSSで垂直方向に文字や画像を揃える方法をみていきましょう。
簡単なようですが、baselineの考え方を理解していないと意図していない形になってしまうので、ざっと確認していきましょう。
CSSで ...CSSで行の高さを調整するやり方
CSSで行の高さを調整するやり方をみていきましょう。
CSSで行の高さを調整するやり方CSSで行の高さを調整する場合、line-heightプロパティを使います。
line-heightは複 ...
CSSでフォントを指定する方法
WebサイトもWebアプリも、画像や動画のちからはあるけども、最も多く使われるのが文字のため、フォントは次第で印象が大きく変化する。
この記事では、CSSでフォントを指定する方法と、フォントの種類をみて ...
CSSでテキストにスタイルを設定する方法
CSSを使ってテキストにスタイルを設定する方法をまとめました。
よく使うものに厳選しているので、確認してみてください。
CSSでテキストにスタイルを設定する方法<h1>CSSでテキスト ...CSSのスタイルの継承
CSSのスタイルの継承を理解することは、とても大事です。
CSSのスタイルの継承を理解していないと、「なんで変化しないの?」といったトラブルや、「なんで設定してないのにこうなってるの?」といった困った状態に ...
CSSの書く場所と基本的な書き方
CSSを勉強する上で、最も基本となる部分を知っておきましょう。
具体的には、
CSSを書く場所CSSの書き方
CSSのクラスセレクターの書き方
を解説します。 ...
HTMLでフォームを作る方法と具体的な使い方
HTMLでは、お問い合わせフォームや、アンケートのフォームを簡単につくることができます。
いろんな便利なフォームがあるのですが、使う際に注意しておかないと、フォームの利用が困惑したり、思った結果が得られない ...
JavaScriptのbind()、call()、apply()メソッドの使い方と違いについて
JavaScriptのbind()メソッドの基本的な使い方とcall()/apply()メソッドとの違いを具体例とともに紹介します。
また、bind()メソッドにはとても便利な使い方ができるので、実際によく ...
JavaScriptのEnhanced Objueft Literals
JavaScriptのEnhanced Objueft Literalsについて便利な使い方をピックアップしました。
JavaScriptのEnhanced Objueft Literalsまずは下のオ ...
JavaScirptのラッパーオブジェクト(Wrapper Object)とは
ラッパーオブジェクト(Wrapper Object)について、簡単にまとめました。
ラッパーオブジェクトとはラッパーオブジェクト(Wrapper Object)とは、プリミティ値を内包するオブジェクトの ...
Gitのブランチの使い方
Gitのブランチの使い方(仕組み、コマンド、一覧の表示、ブランチの切り替え、作成、変更、削除など)を説明しています。
JavaScriptの配列メソッド、どれを使えばいいのか?まとめ
たくさん配列のメソッドがあるけど、どれを使えばいいのか?に対しては、何をしたいのかをまず決める必要があります。
配列のメソッドで「何をしたいのか」をカテゴライズしたので、それに合わせて選択しましょう。
JavaScriptでnpmを利用するメリットと使い始めるために必要な知識
JavaScriptでnpmを利用するメリットと使い始めるために必要な基本的な知識をまとめました。
npmはなぜ必要なのでしょうか?npmを使うと、とても簡単にscriptタグなどを利用することができる ...
Gitとは? Gitの基礎知識と具体的な使い方
Gitとはバージョン管理システムのことです。
バージョン管理するメリットは、
どのファイルの何を誰が
いつ
何のために
変更したかを残すことができます。 ...