navigation
angular
Responsive
angularMaterial
Angular6

Angular6でナビゲーションを利用したいと考えている開発者向けのサンプル

ResponsiveNavigation Angular6でナビゲーションを利用したいと考えている開発者向けのサンプル

MIT License

ResponsiveNavigation は、Angular6においてAngular Materialによりナビゲーションを実現しようと考えている開発者向けの初期セットです。

フルソースコード,
https://github.com/Ohtsu/ResponsiveNavigation

ビデオ解説 (日本語),
https://www.youtube.com/watch?v=X59LfgaGnrM

ビデオ解説 (英語),
https://www.youtube.com/watch?v=F1GUUFpYc-g&t=5s

概要

  • ResponsiveNavigation はリスポンシブなナビゲーションであり、Angular6におけるAngular Materialに依存しています。

  • ResponsiveNavigation は、mat-sidenav,mat-toolbar,mat-nav-listなどを利用しています。

  • ResponsiveNavigation はMaterialアイコンを利用しています。

稼働環境

  • node.js
  • Typescript2
  • Angular6

インストール

以下のように、Gitからクローンを作成します。

$ git clone https://github.com/Ohtsu/ResponsiveNavigation.git 

次に生成されたResponsiveNavigationディレクトリに入り、以下のようにインストールを行います。

$ npm install 

起動

コマンドラインで以下のようにローカルサーバを起動すると、ブラウザにリスポンシブなナビゲーションが表示されます。

$ ng serve -o
  • 初期画面

バージョン

  • ResponsiveNavigation : 0.0
  • Angular6 : 6.0.0
  • TypeScript : 2.7.2
  • @angular/material : 6.2.1

参考

変更履歴

  • 2018.7.11 version 0.0 uploaded

著作権

copyright 2018 by Shuichi Ohtsu (DigiPub Japan)

License

MIT © Shuichi Ohtsu