CSS Stili

Şimdi CSS stili hakkında konuşalım.

Gördüğünüz gibi dizin sayfamız ( http://localhost:3000 ) zaten bazı stiller içeriyor. Dosya yapınıza styles bakarsanız, iki CSS dosyası içeren bir klasör görürsünüz: genel stil sayfası ( globals.css) ve CSS modülü ( Home.module.css).

CSS modülleri, otomatik olarak benzersiz sınıf adları oluşturarak CSS'yi bileşen düzeyinde yerel olarak kapsamanıza olanak tanır. Bu, sınıf adı çakışmaları konusunda endişelenmeden aynı CSS sınıf adını farklı dosyalarda kullanmanıza olanak tanır.

CSS modüllerine ek olarak, Next.js uygulamanızı aşağıdakiler de dahil olmak üzere çeşitli şekillerde şekillendirebilirsiniz:

• Dosyaları içe aktarmanıza izin veren Sass .css .scss.
• Tailwind CSS gibi PostCSS kitaplıkları.
• styled-jsx , styled-components ve emotion gibi JS içinde CSS kitaplıkları

Bu derste, Next.js'de CSS Modülleri ve Sass'ın nasıl kullanılacağı hakkında konuşacağız. Hadi dalalım!