Merge pull request #29 from gitignore-in/enhance-readme

Enhance readme

next.config.js

@@ -3,6 +3,7 @@ const nextConfig = {
   experimental: {},
   output: 'export',
   trailingSlash: true,
+  images: { unoptimized: true },
 }
 
 module.exports = nextConfig

src/app/page.tsx

@@ -1,10 +1,24 @@
 import Link from 'next/link'
+import Image from 'next/image'
 
 export default function Home() {
   return (
     <main>
       <h1>gitignore.in</h1>
       <p>.gitignore generator for your project</p>
+      <h2>Concept</h2>
+      <p>
+        gitignore.in is a tool to generate .gitignore files for your projects.
+        It is inspired by gitignore.io gibo commands. <br />
+        .gitignore.in file stores the target of gibo and gitignore.io, so you
+        can regenerate .gitignore file by gitignore.in command.
+        <Image
+          alt="generate .gitignore from .gitignore.in"
+          width="735"
+          height="336"
+          src="/concept.png"
+        />
+      </p>
       <h2>Installation</h2>
       <h3>Binary Releases</h3>
       <p>
@@ -19,14 +33,14 @@ export default function Home() {
       <p>
         Homebrew (macOS) You can install gitignore-in using the Homebrew package
         manager.
-        <pre>
+        <code>
           $ brew tap gitignore-in/gitignore-in <br />$ brew install gitignore-in
-        </pre>
+        </code>
       </p>
       <h2>Usage</h2>
       <p>
         Usage
-        <pre>$ gitignore.in</pre>
+        <code>$ gitignore.in</code>
         This will generate a .gitignore.in and .gitignore file in the current
         directory.
       </p>