JS

JavaScriptに関する記事をまとめています。

JS

Next.jsで複数画像をpreview表示してuploadする方法

本記事では、ファイルのstorage(保存先)として、Firebase storageを利用します。今回、複数のファイル(画像)をまず画面にpreview表示して、表示した複数の画像をFirebase storageへuploadする方法を紹介致します。
JS

Next.jsとFirebase storageで画像をuploadする方法

Next.jsとFirebaseを組み合わせると、簡単に画像ファイルのアップロードを行うことができます。Next.js はReactのframeworkになります。画像ファイルのstorage(保存先)として、Firebase storageを利用します。
JS

【超簡単】NextJSアプリをVercelにデプロイする方法

NextJSに限らず、モダンなJSアプリをvercelというサービスを利用して、無料公開することができます。GithubアカウントとGithubに公開したいrepositoryが上がっていれば、すぐにデプロイをすることができて便利です。
JS

カルーセル表示を簡単にswiper.jsを利用して実装する方法

カルーセル表示(スライド表示)をswiper.jsを利用して実装する方法を紹介致します。Swiper.jsはカルーセル(スライダー)を作成する人気のあるJavascriptライブラリです。CDNとnpmインストールを利用する方法それぞれ紹介致します。また使えそうなオプションについても紹介致します。
JS

modal window(モーダルウィンドウ)を簡単にmicromodalを利用して作成する方法

micromodal.jsを利用して簡単にmodal window(モーダルウィンドウ)を表示する方法を紹介致します。CDNで実装する方法とnpmコマンドでインストールして実装する方法のどちらも紹介致します。また使えそうなオプションについても紹介しています。
JS

【Vue.js】Firebaseを使ってログイン機能を実装してみた

Vue.jsとFirebaseを使ってログイン機能の実装をやってみました。Firebaseは無料で30日間利用できます。Vue.js側では画面のフォームを用意します。またaxiosを使ってFirebase側と通信を行います。ログインできたら、掲示板を表示して、投稿が見れるという機能を実装していきます。
JS

【Vue.js】Firebaseとaxiosを使ってサーバーにhttp通信をする方法

Vuejsを使って簡単なWebアプリ、掲示板の作成をする方法を紹介します。Firebaseを使うことでサーバーへの通信を簡単に行うことができます。Vuejsからaxiosを使うことでFirebase(サーバー)側へのアクセスを可能にします。コンソール上で確認しつつ、投稿した内容が掲示板上に表示される機能を実装します。