とにかくVSCodeでコードをいじったら、
git add -A
git commit -m "変更点メモ"
git push -u origin master ////ローカルリポジトリーとリモートリポジトリー同期/////
これをやればVercelにも反映することが分かったので、
変更👉上記コマンド👉変更
を繰り返して作業を進められる段階になりました。
開発2日目の続き。
👆これに画像を入れます\(^o^)/
画像はpublicフォルダーへ収納
収納した画像を使用するために、src/pages/index.jsで定義
import Image from 'next/image'
src/pages/index.jsで任意の場所に記述
<Image
src="/image.jpeg"
//layout="fill" これだと画面いっぱいになってしまうのでOFF
width={300}
height={300}
objectFit="contain"
/>
これだと左端に寄った状態になってしまう。。。
中央揃いにするためにプチ改造(同じくsrc/pages/index.js)
<div style={{display: "flex",justifyContent: "center"}}>
<Image src="/image.png" width="300" height="300" objectFit="contain"/>
</div>
できたー(*^^*)
記事にするとすごく簡単に思われますが、実際これに5時間かかりました。😂
英語をちょいと読もうとするだけで得られる情報が変わってくるので、
今後も困りに困ったら英語読むように努力します( ゚д゚)ハッ!
▼ この記事に興味があったら同じタグから関連記事をのぞいてみてね
RSSリーダーにatomのリンクを登録すると通知が行くよ🐌
https://herohoro.com/atom
やってみてね(*´ω`*)(*´ω`*)
フォロー大歓迎\(^o^)/
フォロー大歓迎\(^o^)/