Vue.jsで作成した支出管理アプリに、現在の残高が分かる機能を追加した

前回、Vue.jsで、支出を記録して「記録」ボタンを押すと、今日の支出合計が自動計算されるアプリを作成してみました。 今回、現在の残高を登録して、支出を記録するごとに残高が減っていき、現在の残高が分かる機能を追加しました。 SeethePen Vue3支出管理アプリbyShibataHiroki(@khiro-enginner) onCodePen. 使い方 ...

前回、Vue.jsで、支出を記録して「記録」ボタンを押すと、今日の支出合計が自動計算されるアプリを作成してみました。 今回、現在の残高を登録し...

【Vue.js】今日の支出合計が分かるアプリ

Vue.jsで、支出を記録して「記録」ボタンを押すと、今日の支出合計が自動計算されるアプリを作成してみました。 SeethePen Vue3支出管理アプリbyShibataHiroki(@khiro-enginner) onCodePen. 使い方 例えば、コンビニで88円の水を買ったとすると、入力欄に88と入力して、「記録」ボタンを押します。そうすると、今日の支...

Vue.jsで、支出を記録して「記録」ボタンを押すと、今日の支出合計が自動計算されるアプリを作成してみました。 SeethePen Vue3...

Vue.jsでマークダウンエディターを作ってみた

.wp-block-tabletd{ text-align:left; } この本を参考にして、Vue.jsでMarkdownを作ってみました。 準備 色々と準備をしていきます。 HTMLの雛形を作成する まずは、VScodeの省略記法で、「!」と入力してHTMLの基本的な形を作成します。 作成後のコード

.wp-block-tabletd{ text-align:left; } この本を参考にして、Vue.jsでMarkdownを作ってみま...

vue.jsでカレンダー入力を実現した

クラウドワークスで、お問い合わせフォームの日付入力をプルダウン形式からカレンダー入力形式に変更して欲しいというご相談を受けました。 学習ブログを書いていきます。 今回の要件 引越し予定日の年・月・日をカレンダーから選択できるようにする。 ライブラリを使うための準備 まずは、vue.jsとvuejs-datepickerを読み込みました。 https://cd...

クラウドワークスで、お問い合わせフォームの日付入力をプルダウン形式からカレンダー入力形式に変更して欲しいというご相談を受けました。 学習ブログ...

Vue.jsとjQueryの違い

Vue.jsとjQueryの違いについて見ていきます。 手続的か宣言的か jQueryは手続的であるのに対して、Vue.jsは宣言的です。 シンプルな例 例えば、入力した文字がすぐ下に追加されるというシンプルな例を見ていきましょう。 以下のデモでは、aと入力して追加ボタンを押すと、すぐ下にaと表示されるのが確認できます。 SeethePen jQueryby...

Vue.jsとjQueryの違いについて見ていきます。 手続的か宣言的か jQueryは手続的であるのに対して、Vue.jsは宣言的です...

Google Chartsの円グラフに投票できる例

こちらの参考書のchapter7の内容です。 以下のように、GoogleChartsの円グラフが表示されていて、表のボタンを押すと数字が増えて、グラフも連動して変化するようになっています。 スタバに投票する前 スタバに投票した後 動作環境 vue.jsのバージョンは、2.5.17です。 全体の流れ 先ほどのサンプルを作成するときの全体...

こちらの参考書のchapter7の内容です。 以下のように、GoogleChartsの円グラフが表示されていて、表のボタンを押すと数字...

Vue.jsで、SPAのToDoアプリを作成してみた

この本を参考にして、Vue.jsで、SPA(SinglePageApplication)のToDoアプリを作ってみました。 今回作成したもの SeethePen UntitledbyShibataHiroki(@khiro-enginner) onCodePen. .posth3.mb-25{ margin-bottom:25px; } ...

この本を参考にして、Vue.jsで、SPA(SinglePageApplication)のToDoアプリを作ってみました。 ...

Nuxt.jsをインストールしてみた

vue.jsのフレームワーク「Nuxt.js」をインストールしてみました。 最終的には、スタートページが表示されましたが、 なかなかスムーズにインストールが進まなかったので、その過程も書いていきます。 公式サイトのドキュメント 公式サイトのインストールページにインストールに必要な情報がまとまっていました。 https://nuxtjs.org/ja/docs...

vue.jsのフレームワーク「Nuxt.js」をインストールしてみました。 最終的には、スタートページが表示されましたが、 なか...

vuetifyについて

vuetifyについて調べてみました。 vuetifyとは? Vue.jsのUIフレームワークです。 始め方 https://next.vuetifyjs.com/en/getting-started/installation/#installation 公式ドキュメントの流れに沿って、進めていきました。 vuetifyのインストール y...

vuetifyについて調べてみました。 vuetifyとは? Vue.jsのUIフレームワークです。 始め方 ...

Vueアプリケーションをブラウザで実行しました。

以前の記事で、拡張子が「.vue」のファイルをブラウザに表示させることが出来ませんでした。 本日、公式サイトのクイックスタートにある「Vueアプリケーションの作成」を参考に進めました。 そして、ブラウザでVueアプリケーションを実行することができました。 ブラウザで実行されたVueアプリケーション ブラウザで実行されたVueアプリケーション 本記事では、どのように上...

以前の記事で、拡張子が「.vue」のファイルをブラウザに表示させることが出来ませんでした。 本日、公式サイトのクイックスタートにある「Vueア...

SFCとは何か?

Vue.jsには、SFC(SingleFileComponent)という用語があります。 この記事では、SFCとは何か?について解説していきます。 拡張子は「.vue」 SFCの拡張子は「.vue」です。 どうやって.vueファイルを機能させるか? これまで、CDNでvueのコアファイルを読み込んで、HTMLに少しだけ取り入れるという形で、vue.jsを使用してきま...

Vue.jsには、SFC(SingleFileComponent)という用語があります。 この記事では、SFCとは何か?について解説していきま...

Vue.jsのウォッチャについて学んでみた

vue.jsには、状態を監視する機能があります。 この記事では、ボタンを押すと3秒カウントして、アラートを出すプログラムを作成していきます。 こちらの「chapter8」を参考にしました。 参考書のVue.jsのバージョンは2.5ですが、今回は3系の書き方に変更しました。 今回作成したプログラム 最初は「3秒」と「ボタン」が表示されています。 ...

vue.jsには、状態を監視する機能があります。 この記事では、ボタンを押すと3秒カウントして、アラートを出すプログラムを作成していきます。 ...

Vue.jsのコンポーネントについて学んでみた

vue.jsでは、コンポーネントとしてHTMLをまとめて部品化して、再利用することができます。 この記事では、vue.jsでコンポーネントを作る基礎について書いていきます。 こちらの「chapter12」を参考にしました。 コンポーネントを使用した結果 コンポーネントを使用すれば、以下のように、同じHTMLでテキストだけを変えたものを簡単に増やすことができました。...

vue.jsでは、コンポーネントとしてHTMLをまとめて部品化して、再利用することができます。 この記事では、vue.jsでコンポーネントを作...

Vue.jsをCDNでインストールして、動かしてみた

前回は公式サイトを使用してVue.jsの学習を進めました。 この記事では、Vue.jsをインストールして、Vue.jsのプログラムを動かしてみます。 こちらの参考書を使用しました。 Vue.jsのインストール 色んな方法がありますが、CDNを使用します。 CDNでインストール 一番手軽にVue.jsを使えるようにする方法です。 公式サイト...

前回は公式サイトを使用してVue.jsの学習を進めました。 この記事では、Vue.jsをインストールして、Vue.jsのプログラムを動...

Vue.js 学習 Part1

私はこれまで、WEB制作でjQueryを使用してきましたが、数年前からVue.jsという単語をよく耳にするので、Vue.jsについて学習していきます。 Vue.jsを使えるようにするために最初に行うこと https://ja.vuejs.org/guide/quick-start.html#cdn-の-vue-を使用する まずは、scriptタグで手軽に読み込みたいと思います。...

私はこれまで、WEB制作でjQueryを使用してきましたが、数年前からVue.jsという単語をよく耳にするので、Vue.jsについて学習していきます...

Vue.jsエンジニアの求人情報と報酬を調べてみた

私はこれまでにWEBエンジニアとして、以下のような仕事を経験しました。 エージェントを通した派遣社員としてのWordPress記事コンテンツ作成業務→週3、1日6時間で月10万円ほど地元名古屋のWEB制作会社からの案件受託→例えば、デザインデータからのページ構築の場合、1件3万円ほどクラウドワークスでの案件受託→LPコーディング1件13,000円や、営業管理ツールのフロントエンド構築2ヶ月...

私はこれまでにWEBエンジニアとして、以下のような仕事を経験しました。 エージェントを通した派遣社員としてのWordPress記事コンテンツ作...

ページ
最上部へ

目次へ