製品パート2を造ること
最後のポストでは、我々のMVPを作成し、我々のGitlabリポジトリを設定し、Vercelのホスティングを設定し、我々のドメインをVercelに指摘した.それはたくさんのように聞こえます、そして、それは親切です、しかし、点はちょうど展開される最も最小限のアプリケーションを得ることでした.これは、インターネットに有用な何かを提供するためにバンドエイドとして機能し、一度最初の1つが行われると、それは中毒になります.主な目標は、問題になる機能のクリープなしで可能な限り展開されます.
今日の計画は次のようになります.
Plausible AnalyticsからAnalyticsを加えている
解析スクリプトの追加
まず、Plausibleに頭を下げ、アカウントを作成する必要があります.彼らはクレジットカードなしで30日間のトライアルを行います.アカウントを
Add a websiteにし、スニペットを作成します.
nextjsを使っているので、document.jsという特別なページを使う必要があります.私の
_document.jsがどのように見えるかは、ここにあります.import Document, { Html, Head, Main, NextScript } from "next/document";
class MyDocument extends Document {
static async getInitialProps(ctx) {
const initialProps = await Document.getInitialProps(ctx);
return { ...initialProps };
}
render() {
return (
<Html>
<Head>
<script
async
defer
data-domain="whenarethefights.com"
src="https://plausible.io/js/plausible.js"
></script>
</Head>
<body>
<Main />
<NextScript />
</body>
</Html>
);
}
}
export default MyDocument;
git add . && git commit -m "Add analytics" && git push .次に、このクールな画面を参照してください.
尾風の追加
それで、人気がある何かを使用する主な利点の1つは、非常に簡単なドキュメンテーションを得ています.こちらは、setup tailwinds with NextJsまでの方法です.
インストール
npm install tailwindcss@latest postcss@latest autoprefixer@latest
git commit -am "Add Tailwinds, postcss, and autoprefixer"
npx tailwindcss init -p
tailwind.config.jsとstyles/globals.cssを更新しました// tailwinds.config.js
module.exports = {
purge: ['./pages/ **/*.{js,ts,jsx,tsx}', './components/** /*.{js,ts,jsx,tsx}'],
darkMode: false, // or 'media' or 'class'
theme: {
extend: {},
},
variants: {
extend: {},
},
plugins: [],
}
/* ./styles/globals.css */
@tailwind base;
@tailwind components;
@tailwind utilities;
git commit add . && git commit -m "Configure Tailwind"スタイルの更新
それで、ここでカンニングをして、ちょうどhttps://tailwindui.com/に行くつもりです.理由は、私は最高のデザイナーではない、それだけで簡単です.あなたがこれの代金を払いたくないならば、私が二回、https://kitwind.io/に言及されるのを見た代わりの無料のものがあります.私はコードを投稿するつもりはないので、私はそれを配布するように感じるが、ソースを見たい場合は🤷♂️. これは私が使用するコンポーネントです.それはきれいで、いくつかのバッジがあります.私は、それが私が必要とするものにかなり近いと思います.
HERES現在の情報による最終レイアウト
私は、それが良い停止点であると思うので、保存して、約束して、押しましょう.一度私たちは私たちのためのレイアウトを構築する反応させると我々の次の展開について考え始めることができます.
これは2021年に250000語を試して、書く実験の一部です.それは正確ではないだけ緩んで進行状況を追跡するためのものです.
現在の単語数
毎日平均:~ 121
毎日の平均ゴール:~ 685
Reference
この問題について(製品パート2を造ること), 我々は、より多くの情報をここで見つけました https://dev.to/mikebobadilla/building-a-product-part-2-7ldテキストは自由に共有またはコピーできます。ただし、このドキュメントのURLは参考URLとして残しておいてください。
Collection and Share based on the CC Protocol