microverse HTML CSS capstone project online shop for electronics

オンラインショップ（インデックスと検索ページ） - 16時間構築された時間

これは、MicroverseモジュールHTML/CSSのCapstone/Examプロジェクトです。 HTML、CSS3/SCSS、Bootstrap、およびFont Awesomeを使用したクラフト（手作業）のWebサイトです。

ここでプロジェクトのビデオプレゼンテーションをご覧ください。ウェブサイトは、このモックアップを使用して構築されています

インデックスページのスクリーンショット

検索ページのスクリーンショット

このプロジェクトは、グリッドとフレックスの支持者を広範囲に使用して、HTMLおよびCSS/SCSSを使用して構築されています。すべてのSCSSコア機能、変数、ミキシン、色関数を使用しました。

で構築されています

• HTML
• CSS3/SCSS
• ブートストラップ
• フォント素晴らしいアイコン
• webhint/stylelintリナー
• SCSSの変更をテストおよび実行するためのNPMスクリプト

私の中程度の記事を読んでウェブサイトを構築するときに使用するワークフローを確認できます。

ライブデモ

ライブデモインデックスページ

ライブデモ検索ページ

（ナビゲーションリンクと検索フォームを使用して、ページ間でナビゲートすることもできます。）

ローカルコピーを稼働させるには、これらの簡単な例の手順に従ってください。

設定

プロジェクトをローカルにクローンします。

リナー

1. npm installを実行します。
2. npm run testを実行して、HTMLおよびCSSファイルを確認します。
3. npm run watchを実行して、SCSSの変更を監視し始めます。

展開

IDE/テキストエディターにライブサーバープラグインをインストールして実行し、ルートディレクトリから実行します。

将来の改善

ページにバックエンドを追加します

著者

？クリスティアン・ヴィオレル・シーマツ

• メール：[email protected]
• Github：https：//github.com/cristianceamatu
• Twitter：https：//twitter.com/cristianceamatu
• LinkedIn：https：//www.linkedin.com/in/ceamatu-cristian/

あなたのサポートを見せてください

あなたがこのプロジェクトが好きなら§を贈りましょう！

ライセンス

このプロジェクトはMITライセンスです。