https://github.com/adnankasikci/musicweb

I created a site to understand many topics in Tailwind CSS.
https://github.com/adnankasikci/musicweb

tailwind tailwindcss tailwindui

Last synced: about 1 month ago
JSON representation

I created a site to understand many topics in Tailwind CSS.

• Host: GitHub
• URL: https://github.com/adnankasikci/musicweb
• Owner: adnankasikci
• License: mit
• Created: 2023-05-30T21:29:14.000Z (over 1 year ago)
• Default Branch: main
• Last Pushed: 2023-12-16T23:25:27.000Z (about 1 year ago)
• Last Synced: 2023-12-17T00:26:41.771Z (about 1 year ago)
• Topics: tailwind, tailwindcss, tailwindui
• Language: CSS
• Homepage: https://musicprize.netlify.app/
• Size: 2.48 MB
• Stars: 1
• Watchers: 1
• Forks: 0
• Open Issues: 0
• Metadata Files:
  • Readme: README.md
  • License: LICENSE

Awesome Lists containing this project

README

        

## Prize Music Site with Tailwind

Tailwind yaklaşımlarına aşinalık ve tailwind teknolojisini anlama. https://musicprize.netlify.app/

### Proje Hakkında

Prize Music Site, müzik severlere hit şarkıları keşfetme ve dinleme imkanı sunan bir web sitesidir. Bu projede Tailwind CSS kullanılarak oluşturulmuştur.

#### Proje Amaçları

---

- Tailwind CSS ile çalışmaya aşinalık kazanmak

- Web tasarımında responsive ve kullanıcı dostu bir deneyim sunmak

- Müzikle ilgili bilgileri paylaşmak ve kullanıcılara müzik dinleme imkanı sağlamak

#### Projede Kullanılanlar

---

Bu projede tailwind konularına daha iyi hakim olabilmek için farklı örnekleri de görebilme adına hazırlanmış bir web sitedir.

- Teknoloji yapısını iyi anlamak

- Kullanılan yapılara aşina olmak

- Tailwind folder structure ile çalışma mantığını anlamak

- Tailwind tema desteği ile çalışmak

- Tailwind.config.js pratikleri ile işleyiş mantığı

#### Kullanılanlar

---

- Hover visited active focus hareketleri ile çalışma

- Değişkenlerle çalışma ve first mobile class yapıları ile çalışma

- Tailwind ve kütüphanelerin iç içe kullanımı

- Responsive uyumlu tasarım

- Dark Mode ve beyaz tema ile çalışma

## Kurulum

Proje dosyalarını bilgisayarınıza indirdikten sonra aşağıdaki adımları takip ederek projeyi kurabilirsiniz:

1. Proje dizinine gidin: `cd prize-music-site`

2. Gerekli bağımlılıkları yüklemek için `npm install` komutunu çalıştırın.

3. Projeyi başlatmak için `npm run watch` komutunu kullanın.

4. Tarayıcınızda `http://localhost:3000` adresine gidin ve Prize Music Site'i görüntüleyin.

## Kullanım

Proje kullanımıyla ilgili aşağıdaki detayları göz önünde bulundurun:

- Proje ana sayfasında mevcut olan örnekleri inceleyebilirsiniz.

- Proje yapısını ve kullandığımız tailwind tekniklerini inceleyerek çalışma mantığını anlayabilirsiniz.

- Açıklamaları takip edin ve kavrayın.

- Proje dosyalarında `tailwind.config.js` ile projeyi yönetin  `npm run watch` ile projeyi çalıştırın.

```SASS

>>package.json

//Kullanımı

"scripts": {

    "watch": "npx tailwindcss -i ./input.css -o ./public/css/style.css --watch"

},

```

## Katkıda Bulunma

Eğer projeye katkıda bulunmak isterseniz, lütfen aşağıdaki adımları takip edin:

1. Bu projeyi fork edin.

2. Yeni bir dal oluşturun: `git checkout -b feature/yeni-ozellik`.

3. Yaptığınız değişiklikleri işleyin: `git commit -am 'Yeni özellik ekle'`.

4. Dalınıza itme yapın: `git push origin feature/yeni-ozellik`.

5. Pull Request göndermek için GitHub üzerinden talep oluşturun.

## İletişim

Herhangi bir sorunuz, öneriniz veya geri bildiriminiz varsa, lütfen göndermekten çekinmeyin.:relieved:

Daha fazla bilgi için [proje dokümantasyonunu](https://github.com/ad0pa/musicWeb) ziyaret edin.

Teşekkür ederiz!