feat: добавлены примеры картинок (и статических и внешних)

next.config.js

@@ -1,4 +1,6 @@
-const {withAxiom} = require('next-axiom');
+/* eslint-disable @typescript-eslint/no-var-requires */
+
+const {withAxiom} = require("next-axiom")
 const {withSentryConfig} = require("@gooditworks/monitoring/next")
 
 const isDeploy = ["production", "preview"].includes(process.env.VERCEL_ENV)
@@ -11,10 +13,18 @@ const sentryConfig = {
 const config = {
   sentry: {
     disableServerWebpackPlugin: !isDeploy,
-    disableClientWebpackPlugin: !isDeploy,
+    disableClientWebpackPlugin: !isDeploy
   },
   experimental: {
     appDir: true
+  },
+  images: {
+    remotePatterns: [
+      {
+        protocol: "https",
+        hostname: "www.freecodecamp.org",
+      }
+    ]
   }
 }
 

src/app/page.tsx

@@ -1,5 +1,22 @@
 import {FC} from "react"
+import Image from "next/image"
 
-const IndexPage: FC = () => <h2>TODO: put README there</h2>
+import giwLogo from "public/gooditworks.png"
+
+const IndexPage: FC = () => (
+  <div className="p-4">
+    <h2>TODO: put README there</h2>
+    <p>btw, our logo (static):</p>
+    <Image src={giwLogo} alt="Good iT Works logo" sizes="100vw" />
+    <p>and nice Next.js meme (external url)</p>
+    <Image
+      src="https://www.freecodecamp.org/news/content/images/2020/08/meme.jpg"
+      alt="meme about next.js"
+      width={888}
+      height={499}
+      sizes="100vw"
+    />
+  </div>
+)
 
 export default IndexPage

tsconfig.json

@@ -12,6 +12,9 @@
   "exclude": ["node_modules"],
   "compilerOptions": {
     "baseUrl": "src",
+    "paths": {
+      "public/*": ["../public/*"]
+    },
     "moduleResolution": "node",
     "module": "commonjs",
     "jsx": "preserve",