はじめる

use-bootstrap は、Nuxt3 と Bootstrap5 をベースにしたフロントエンド フレームワークです。

Template Repository を利用した開始方法

use-bootstrap-starter リポジトリはテンプレートとして利用できます。

テンプレートをコピーして、独自のアプリケーションを作成する方法を解説します。

事前にGitHubアカウントを作成し、ログインしてください。

またStackBlitzで開発する場合は、GitHubアカウントをStackBlitzと連携してください。

0. GitHubリポジトリにスターをつける

忘れてはならない最も重要な最初のステップは、GitHubリポジトリにスターをつけることです。

use-bootstrapのメインのリポジトリを開き、スターをクリックしてください。

use-bootstrap

1. Template Repository を開く

下記の use-bootstrap-starter リポジトリ ページを開きます。

2. 新しいリポジトリを作成する

Use this Template ボタンをクリックし、Create a new repositoryをクリックします。

新しいリポジトリの作成画面が表示されます。

use-bootstrap-starter

3. リポジトリの作成を完了する

自由にリポジトリ名を登録してください。その他の項目も必要に応じて設定します。

Create repository from template をクリックします。

use-bootstrap-starter

4. Stackblitz で開発する

GitHubアカウントと連携済のStackblitzにログインします。

Repositoris ページに、作成したリポジトリが表示されています。

クリックするとStackblitzで開発できます。

Stackblitzは直ちに実行されますので、画面が表示されるまで数分待機してください。

よく利用するターミナル コマンド

docs フォルダを起動します

 npm run dev 

usebootstrap ライブラリをアップデートします

 npm install usebootstrap 

Nuxtを停止します。

ctrl + c

クリーン インストール

Nuxtプロジェクトを作成する

 npx nuxi@latest init project-name 

use-bootstrap NPMパッケージをインストールする

 npx nuxi@latest module add usebootstrap