strapi starter next corporateダウンロード - strapi starter next corporateソースコードダウンロード

strapi starter next corporate

AI ソースコード

1.0.0

ダウンロード

deed廃止

このリポジトリは維持されなくなり、Strapi V3でのみ機能します。このスターターの最新のStrapi V4バージョンは、Starters-and-Templates Monorepoで見つけることができます。

Strapi Starter Next Corporateサイト

Strapiで企業サイトを作成するための次のスターター。

ライブデモを表示•ブログ投稿を読んでください

スクリーンウェブサイト

このスターターは、柔軟性のために設計されています。それを使用して、Webサイトのコンテンツを完全にStrapiで管理し、次のアプリを自動的に生成することができます。マーケティングチームは、開発者のヘルプなしでページを作成し、レイアウトを設計することができます。

このスターター機能：

Strapi内のページ作成、コードは必要ありません
完全に柔軟なページ構造：UIセクションを使用して必要なページを設計する
箱から出して8つのUIセクション：Hero、RichText、LargeVideo、Testimolials、Pricing、Bottomactions、featurelows、featurecolumns
Tailwindを使用したテーマが簡単です
次の静的サイト生成
公開する前にプライベートURLでページを表示する統合プレビューモード
i18nを使用した複数の言語のコンテンツ

このスターターは、Strapi Corporateテンプレートを使用しています

こちらのすべてのスターターをご覧ください

はじめる

create-strapi-starter CLIを使用してプロジェクトを作成します。

npx create-strapi-starter@3 my-site next-corporate

CLIは、モノレポを作成し、依存関係をインストールし、プロジェクトを自動的に実行します。

次のFrontendサーバーはここで実行されます=> http：// localhost：3000

Strapi BackEndサーバーはここで実行されます=> http：// localhost：1337

プレビューモード

このようなURLでプレビューモードをオンにすることができます。

http://localhost:3000/api/preview?secret=<preview-secret>&slug=<slug>

<preview-secret>は、.env configで定義され<slug>いる秘密のトークンです。

プレビューモードがオンになっている間、 publishedページと同じようにdraftページにアクセスできます。

たとえば、http：// localhost：3000/secretはプレビューモードで利用できます。

バナーはナビゲーションの下に残り、プレビューモードがオンになっていることを知らせ、オフにすることもできます。

企業サイトをカスタマイズします

このWebサイトを編集するには、開発環境でフロントエンドとバックエンドの両方を実行する必要があります。

セクションの追加

私たちはあなたのためにセクションを構築しましたが、あなたはあなたのニーズに合わせてさらに追加したいと思うでしょう。次の手順に従ってください：

「セクション」カテゴリでStrapiで新しいコンポーネントを作成する
Content-Types Builderで、ページコレクションを開き、 contentSectionsフィールドの新しいセクションを確認します。
/frontend/components/sectionsでdataプロップを取得するReactコンポーネントを作成します
StrapiセクションをこのReactコンポーネントにリンクするには、wote /frontend/components/sections.js openにリンクし、 sectionComponentsオブジェクトにエントリを追加します。

カスタムテーマ

スタイリングにはTailwind CSSを使用します。ページの外観を変更するには、テーマを/front/tailwind.config.jsで編集できます。 Tailwindドキュメントを読んで、できるすべての変更を表示してください。たとえば、次のような主要な色を変更できます。

 const { colors } = require ( `tailwindcss/defaultTheme` )

module . exports = {
  theme : {
    extend : {
      colors : {
        primary : colors . green ,
      } ,
    } ,
  } ,
}