-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.json
1 lines (1 loc) · 61.6 KB
/
index.json
1
[{"categories":null,"content":"Arduino ile Kırmızı Işıkta Duran araba Yapmak Arduino trafik projesi, uzaktan kumandalı araba ve trafik setini içerien bir IOT projesidir. Bu projede esp8266 kartı ile wifi üzerinden kontrol edilebilen bir araç geliştirilmiştir. Trafik setinde ise arduino kartı ile trafik ışıklarının kırmızı ve yeşil olarak yanmasını sağlıyoruz. Projedeki kodlar aracın önüne bariyer çıktığında ilerlemesini engelleyecek şekilde ayarlanmıştır. ","date":"02-16-2024","objectID":"/arduino_traffic_project/:0:0","series":null,"tags":["Arduino","IoT"],"title":"Arduino Trafik Seti Projesi","uri":"/arduino_traffic_project/#"},{"categories":null,"content":" Arabanın Geliştirilmesi Malzemeler; Araç için hazır satılan arduino araç setlerini alabilirsiniz. Bunlardan hariç mesafe sensörü ve wifi bağlantısı için esp8266 NodeMCU karta ihtiyacınız olacak. Araç parçaları: Tekerlekler ve gövdesi 2 adet DC Motor L298N Motor sürücüsü HC-SR04 Ultrasonik mesafe sensörü NodeMCU Esp8266 Kart Araç Malzemeleri Motor Sürücü ","date":"02-16-2024","objectID":"/arduino_traffic_project/:1:0","series":null,"tags":["Arduino","IoT"],"title":"Arduino Trafik Seti Projesi","uri":"/arduino_traffic_project/#arabanın-geliştirilmesi"},{"categories":null,"content":" 1. Adım: Arabanın monte edilmesiAşağıdaki devre şemasına göre arabanın montajını yapabilirsniz. Detaylı montaj için videoyu izleyin. Araba Montaj Videosu ","date":"02-16-2024","objectID":"/arduino_traffic_project/:1:1","series":null,"tags":["Arduino","IoT"],"title":"Arduino Trafik Seti Projesi","uri":"/arduino_traffic_project/#1-adım-arabanın-monte-edilmesi"},{"categories":null,"content":" 2. Adım: Apk nın yüklenmesiArabayı wifi üzerinden kontrol edeceğimiz apkyı indiriyoruz. Aşağıda verilecek hazır kod ile nodemcu nun kendi wifisinin oluşturulması sağlandı. İndirilen apk ile Nodemcunun yani arabanın wifisine bağlanıp kontrol sağlanacaktır. Apk indirme linki: Apk Linki ","date":"02-16-2024","objectID":"/arduino_traffic_project/:1:2","series":null,"tags":["Arduino","IoT"],"title":"Arduino Trafik Seti Projesi","uri":"/arduino_traffic_project/#2-adım-apk-nın-yüklenmesi"},{"categories":null,"content":" 3. Adım: KodlamaAşağıdaki kodu esp kartınıza yükleyiniz. Esp kartınıza ilk defa yükleme yapıyorsanız Arduino ide üzerinizden öncelikle kartınızı seçmiş olmanız gerekir. // Motor kontrol pinleri #define ENA 14 // Sağ motorların hızını kontrol etmek için kullanılan pin (Enable) GPIO14(D5) #define ENB 12 // Sol motorların hızını kontrol etmek için kullanılan pin (Enable) GPIO12(D6) #define IN_1 15 // Sağ motorun ileri yönde dönüşünü kontrol etmek için kullanılan pin GPIO15(D8) #define IN_2 13 // Sağ motorun geri yönde dönüşünü kontrol etmek için kullanılan pin GPIO13(D7) #define IN_3 2 // Sol motorun ileri yönde dönüşünü kontrol etmek için kullanılan pin GPIO2(D4) #define IN_4 0 // Sol motorun geri yönde dönüşünü kontrol etmek için kullanılan pin GPIO0(D3) // Kütüphaneler #include \u003cESP8266WiFi.h\u003e #include \u003cWiFiClient.h\u003e #include \u003cESP8266WebServer.h\u003e // Uygulama komut durumu ve motor hızı değişkenleri String command; // Uygulama komut durumunu saklamak için kullanılan String. int speedCar = 800; // Motor hızı (400 - 1023). int speed_Coeff = 3; // Motor hızı katsayısı. // Mesafe sensörü pinleri int trigPin = 4; int echoPin = 5; // Mesafe ölçümü için değişkenler long zaman; long mesafe; // WiFi ayarları const char* ssid = \"NodeMCU Car\"; ESP8266WebServer server(80); void setup() { // Mesafe sensörleri için pin modları ayarlanıyor pinMode(trigPin, OUTPUT); pinMode(echoPin, INPUT); // Motor pinlerinin modları ayarlanıyor pinMode(ENA, OUTPUT); pinMode(ENB, OUTPUT); pinMode(IN_1, OUTPUT); pinMode(IN_2, OUTPUT); pinMode(IN_3, OUTPUT); pinMode(IN_4, OUTPUT); Serial.begin(115200); // WiFi bağlantısı yapılıyor WiFi.mode(WIFI_AP); WiFi.softAP(ssid); IPAddress myIP = WiFi.softAPIP(); Serial.print(\"AP IP address: \"); Serial.println(myIP); // Web sunucusu başlatılıyor server.on(\"/\", HTTP_handleRoot); server.onNotFound(HTTP_handleRoot); server.begin(); } void goAhead() { // İleri git fonksiyonu digitalWrite(IN_1, LOW); digitalWrite(IN_2, HIGH); analogWrite(ENA, speedCar); digitalWrite(IN_3, LOW); digitalWrite(IN_4, HIGH); analogWrite(ENB, speedCar); } void goBack() { // Geri git fonksiyonu digitalWrite(IN_1, HIGH); digitalWrite(IN_2, LOW); analogWrite(ENA, speedCar); digitalWrite(IN_3, HIGH); digitalWrite(IN_4, LOW); analogWrite(ENB, speedCar); } void goRight() { // Sağa git fonksiyonu digitalWrite(IN_1, HIGH); digitalWrite(IN_2, LOW); analogWrite(ENA, speedCar); digitalWrite(IN_3, LOW); digitalWrite(IN_4, HIGH); analogWrite(ENB, speedCar); } void goLeft() { // Sola git fonksiyonu digitalWrite(IN_1, LOW); digitalWrite(IN_2, HIGH); analogWrite(ENA, speedCar); digitalWrite(IN_3, HIGH); digitalWrite(IN_4, LOW); analogWrite(ENB, speedCar); } void goAheadRight() { // Sağa çapraz ileri git fonksiyonu digitalWrite(IN_1, LOW); digitalWrite(IN_2, HIGH); analogWrite(ENA, speedCar/speed_Coeff); digitalWrite(IN_3, LOW); digitalWrite(IN_4, HIGH); analogWrite(ENB, speedCar); } void goAheadLeft() { // Sola çapraz ileri git fonksiyonu digitalWrite(IN_1, LOW); digitalWrite(IN_2, HI","date":"02-16-2024","objectID":"/arduino_traffic_project/:1:3","series":null,"tags":["Arduino","IoT"],"title":"Arduino Trafik Seti Projesi","uri":"/arduino_traffic_project/#3-adım-kodlama"},{"categories":null,"content":" Trafik Setinin Geliştirilmesi Trafik setinde arabanın ve yayanın geçeceği iki adet yol tasarlandı. Yayalara kırmızı yandığında araçlara yeşil yanmaktadır. Aynı zamanda kırmızı yanan tarafın geçişini engellemek için yol girişleri kırmızı ışıkta bariyer ile kapatılır. Malzemeler Karton malzemeler (yolların ve ışık direklerinin yapılması için) Bariyerler için iki adet micro servo motor Arduino uno Trafik ışıkları için ledler ","date":"02-16-2024","objectID":"/arduino_traffic_project/:2:0","series":null,"tags":["Arduino","IoT"],"title":"Arduino Trafik Seti Projesi","uri":"/arduino_traffic_project/#trafik-setinin-geliştirilmesi"},{"categories":null,"content":" Adım 1: Fiziksel bağlantıların yapılmasıTrafik setinin tasarımını yaptıktan sonra bağlatıları aşağıdaki gibi yapın. Servo motorların hareket eden koluna yolu kapatıp açacak bariyerleri bağlayın. ","date":"02-16-2024","objectID":"/arduino_traffic_project/:2:1","series":null,"tags":["Arduino","IoT"],"title":"Arduino Trafik Seti Projesi","uri":"/arduino_traffic_project/#adım-1-fiziksel-bağlantıların-yapılması"},{"categories":null,"content":" Adım 2: Kodlamanın yapılmasıAdruino uno ya yüklenecek gerekli kodlar aşağıdadır. #include \u003cServo.h\u003e //import library Servo myservo; int led = 13 Servo myservo1; int led1 = 12; void setup() { pinMode(led, OUTPUT); myservo.attach(9, 500, 2500); pinMode(led1, OUTPUT); myservo1.attach(10, 500, 2500); } void loop() { // Rotate Servo 3 by 180 degree myservo.write(90); myservo1.write(0); delay(10); digitalWrite(led, HIGH); delay(8000); digitalWrite(led, LOW); myservo.write(0); myservo1.write(0); delay(1000); myservo.write(0); myservo1.write(90); delay(10); digitalWrite(led1, HIGH); delay(8000); digitalWrite(led1, LOW); myservo.write(0); myservo1.write(0); delay(1000); } ","date":"02-16-2024","objectID":"/arduino_traffic_project/:2:2","series":null,"tags":["Arduino","IoT"],"title":"Arduino Trafik Seti Projesi","uri":"/arduino_traffic_project/#adım-2-kodlamanın-yapılması"},{"categories":null,"content":" Bu etkinlikte wokwi similasyonu üzerinden oluşturulan projeyi Arduino Clouda bağlayacağız. Cloud üzerinden devreki ledi ve lcd ekranı kontrol edecek, dht sensöründen verileri clouda taşıyacağız. ","date":"12-08-2023","objectID":"/arduino_iot_project/:0:0","series":null,"tags":["Arduino","IoT","Wokwi"],"title":"Arduino Cloud ve Wokwi ile Iot Projesi","uri":"/arduino_iot_project/#"},{"categories":null,"content":" Adım 1: Arduino Cloud Arduino Cloud üzerinden ücretsiz bir hesap oluşturun. IoT projesi için yeni bir “thing” oluşturun. Bu sayfada üç bölüm var. “Variables” bizim projemizde kullancağımız değişkenleri ifade eder. “Device” kısmından kullanılacak cihaz tanımlaması ve yönetimi yapılır. “Network” kısmından ağ ayarları gerçekleşir. Proje için dört adet variable oluşturun: İsim: sicaklik, Tür: Temperature sensor (°C), İzinler: Read Only İsim: nem, Tür: Relative humidity, İzinler: Read Only İsim: mesaj, Tür: Character string, İzinler: Read \u0026 Write İsim: led, Tür: Boolean, İzinler: Read \u0026 Write Ardından, “device” ayarlamalarına geçin ve şu adımları takip ederek cihazı seçin: Add device \u003e Third party device \u003e ESP32 \u003e DOIT ESP32 DEVKIT V1 Bu adımları tamamladıktan sonra “secret key” ve “device id” bilgilerini kopyalayın ve not defterine kaydedin! Son olarak, network ayarlarını yapılandırın. Wi-fi name olarak “Wokwi-GUEST” yazın ve password kısmını boş bırakın. Secret key kutucuğuna kopyaladığınız secret key’i ekleyin. ","date":"12-08-2023","objectID":"/arduino_iot_project/:1:0","series":null,"tags":["Arduino","IoT","Wokwi"],"title":"Arduino Cloud ve Wokwi ile Iot Projesi","uri":"/arduino_iot_project/#adım-1-arduino-cloud"},{"categories":null,"content":" Adım 2: Arduino Cloud Dashboard Sol menüden Dashboard’ı seçin. “CREATE DASHBOARD” butonuna tıklayarak yeni bir dashboard oluşturun. Düzenleme bölümüne geçin ve Add butonuna tıklayarak şu adımları takip edin: Things \u003e proje_ismi \u003e Tüm variable’ları seçin \u003e “Create widgets” diyerek tamamlayın. ","date":"12-08-2023","objectID":"/arduino_iot_project/:2:0","series":null,"tags":["Arduino","IoT","Wokwi"],"title":"Arduino Cloud ve Wokwi ile Iot Projesi","uri":"/arduino_iot_project/#adım-2-arduino-cloud-dashboard"},{"categories":null,"content":" Adım 3: Wokwi SimülasyonuBu projenin Wokwi uygulamasının hazır linkine buradan ulaşabilirsiniz. Kodları kendi cloudunuza göre düzenlemek için thingsProperties.h dosyasını açın ve aşağıdaki kısımları kendinize göre değiştirin. DEVICE_LOGIN_NAME “kaydettiğiniz_device_id” DEVICE_KEY “kaydettiğiniz_secret_key” ","date":"12-08-2023","objectID":"/arduino_iot_project/:3:0","series":null,"tags":["Arduino","IoT","Wokwi"],"title":"Arduino Cloud ve Wokwi ile Iot Projesi","uri":"/arduino_iot_project/#adım-3-wokwi-simülasyonu"},{"categories":null,"content":" Adım 4: Projeyi ÇalıştırmaArtık simülasyonu başlatabilirsiniz. Simülasyonun clouda bağlanması birkaç dakika sürebilir. Simülasyon önce wi-fi ye bağlanacak ardından cloud ile bağlantı kuracaktır. Dashboardda oluşturduğunuz widgetlardan simülasyondaki ledi ve lcd yi kontrol edebilir, dht sensörden gelen verileri de ilgili widgetlarda görebilirsiniz. ","date":"12-08-2023","objectID":"/arduino_iot_project/:4:0","series":null,"tags":["Arduino","IoT","Wokwi"],"title":"Arduino Cloud ve Wokwi ile Iot Projesi","uri":"/arduino_iot_project/#adım-4-projeyi-çalıştırma"},{"categories":null,"content":"Arduino Cloud, Arduino projelerini bulutta geliştirmeyi ve yönetmeyi sağlayan bir hizmettir. Arduino IDE’ye entegre olan Arduino Cloud, kodlarınızı kaydetmenize, paylaşmanıza, yönetmenize ve uzaktan çalıştırmanıza olanak tanır. Arduino Cloud, IoT projeleri geliştirmek için ideal bir platformdur. Arduino Cloud’un IoT özellikleri, projeleriniz için bağlantı, kontrol ve izleme sağlar. Arduino Cloud’un IoT özellikleri şunlardır: Bulut bağlantısı: Arduino Cloud, projeleriniz için güvenli ve güvenilir bir bulut bağlantısı sağlar. Bu, projelerinizle dünyanın her yerinden bağlanmanızı sağlar. Cihaz yönetimi: Arduino Cloud, cihazlarınızı yönetmenize ve izlemenize yardımcı olur. Bu, cihazlarınızın durumunu ve performansını takip etmenizi sağlar. Veri analizi: Arduino Cloud, verilerinizi analiz etmenize yardımcı olur. Bu, verilerinizden trendler ve içgörüler elde etmenizi sağlar. ","date":"12-07-2023","objectID":"/arduino_cloud_wokwi/:0:0","series":null,"tags":["Arduino","IoT","Wokwi"],"title":"Arduino Cloud ve Wokwi","uri":"/arduino_cloud_wokwi/#"},{"categories":null,"content":" WokwiWokwi, gerçek bir Arduino kartına benzer bir sanal Arduino ortamı sağlar. Bu, Arduino projelerinizi geliştirmeyi ve test etmeyi daha kolay ve daha hızlı hale getirir. Ücretsiz, kullanımı kolay ve güçlü özellikleri olan bir platformdur. Ardunino Cloud ve Wokwi kullanarak Bir Nesnelerin İnterneti (IoT) Projesi İçin Tıklayınız. ","date":"12-07-2023","objectID":"/arduino_cloud_wokwi/:1:0","series":null,"tags":["Arduino","IoT","Wokwi"],"title":"Arduino Cloud ve Wokwi","uri":"/arduino_cloud_wokwi/#wokwi"},{"categories":null,"content":"Arch tabanlı Linux işletim sistemlerine Node.js kurmak için birkaç farklı yöntem vardır. En yaygın yöntemlerden biri, Node.js’yi paket yöneticisi aracılığıyla kurmaktır. ","date":"11-02-2023","objectID":"/arch_dagitimlarinda_nojejs_npm/:0:0","series":null,"tags":["arch","node.js"],"title":"Node.js Kurulumu: Linux arch tabanlı dağıtımlar","uri":"/arch_dagitimlarinda_nojejs_npm/#"},{"categories":null,"content":" Kurulum pacman ile kurulum pacman -S nodejs Bu komut, Node.js’nin en son kararlı sürümünü kuracaktır. Aur ile kurulum Arch User Repository (AUR), Arch tabanlı Linux dağıtımları için üçüncü taraf paketlerin bir havuzudur. AUR’dan Node.js’yi kurmak için aşağıdaki komutu kullanın: yay -S node 2. Node.js Kurulumunu Doğrulama Node.js’nin başarıyla kurulduğunu doğrulamak için aşağıdaki komutlardan birini kullanın: node node -v node --version Bu komutlar, Node.js’nin kurulu sürümünü görüntüleyecektir. ","date":"11-02-2023","objectID":"/arch_dagitimlarinda_nojejs_npm/:0:1","series":null,"tags":["arch","node.js"],"title":"Node.js Kurulumu: Linux arch tabanlı dağıtımlar","uri":"/arch_dagitimlarinda_nojejs_npm/#kurulum"},{"categories":null,"content":" npmnpm, Node.js için bir paket yöneticisidir. Node.js uygulamaları için gerekli olan modülleri ve paketleri bulmak, yüklemek, güncellemek ve kaldırmak için kullanılır. npm, JavaScript tabanlı uygulamalar geliştirmek için yaygın olarak kullanılan bir araçtır. Node.js’nin varsayılan paket yöneticisidir ve dünyanın en büyük yazılım kayıt defterlerinden biridir. npm, aşağıdakiler için kullanılabilir: Node.js uygulamaları için gerekli olan modülleri ve paketleri bulmak ve yüklemek Modülleri ve paketleri güncellemek ve kaldırmak Modüllerin ve paketlerin bağımlılıklarını yönetmek Modülleri ve paketleri paylaşmak ve dağıtmak 1. npm kurulumu Eğer node.js’i pacman ile kurduysanız aşağıdaki komutu terminalde çalıştırarark npm’i kurabilirsiniz. npm install -g npm Kurulumu yay ile yaptıysanız aşağıdaki komutu giriniz. yay -S npm Bu komutlar, npm’nin en son kararlı sürümünü kuracaktır. 2. npm Kurulumunu Doğrulama npm -v npm --version ","date":"11-02-2023","objectID":"/arch_dagitimlarinda_nojejs_npm/:0:2","series":null,"tags":["arch","node.js"],"title":"Node.js Kurulumu: Linux arch tabanlı dağıtımlar","uri":"/arch_dagitimlarinda_nojejs_npm/#npm"},{"categories":null,"content":" VS Code Git: Terminalsiz Git KullanımıGit işlemlerinin tamamı terminal kullanmadan vs code üzerinden nasıl yapılır, bu yazıda anlatılmaktadır. ","date":"10-22-2023","objectID":"/vs_code_git/:1:0","series":null,"tags":["github","git","VsCode"],"title":"Vs Code ile Git Kullanımı","uri":"/vs_code_git/#vs-code-git-terminalsiz-git-kullanımı"},{"categories":null,"content":" Git ile ilişikilendirmeTerminalde “git init” olarak verdiğimiz bu komutu Vs Code’da basit şekilde yapmak mümkün. Sol taraftaki icon bardan üçüncü ikon Vs Code’da git işlemelerini yapmaya ve takip etmeye olanak sağlar. Bu ikon tıklandığında aşağıdaki gibi bir görüntü gelecektir. Kırmızı alan içerisinde belirtilen “Initialize Repository” Vs Code’da açmış olduğunuz klasörü git ile ilişkilendirir. Bu işlemden sonra açılan sidebarda commit, remote, push gibi diğer işlemleri yapmak mümkün. Source Control Repositories başlığı altında git ile ilişkilendirilen klasörleriniz yer alır. Source Control bölümü altında yapılan değişiklikler gösterilir. ","date":"10-22-2023","objectID":"/vs_code_git/:1:1","series":null,"tags":["github","git","VsCode"],"title":"Vs Code ile Git Kullanımı","uri":"/vs_code_git/#git-ile-ilişikilendirme"},{"categories":null,"content":" CommitYukarıdaki görselde git_ornek klasörü git ile ilişkilendirilmiş ve içerisine iki adet dosya eklenmiştir. Şimdi bu değişiklikleri commit edelim. “Message” kutusuna commit mesajınızı yazdıktan sonra butona tıklıyoruz. Mesaj olarak “files added” yazıp commit butonuna tıklıyorum. Commit işlemi tamamlandı. ","date":"10-22-2023","objectID":"/vs_code_git/:1:2","series":null,"tags":["github","git","VsCode"],"title":"Vs Code ile Git Kullanımı","uri":"/vs_code_git/#commit"},{"categories":null,"content":" Git HistoryGit history, Vs Code’da git geçmişini görüntülemenizi sağlayan bir eklentidir. Aynı zamanda bu eklentiden yaptığız işlemleri geri almanız da mümkündür. Eklentiyi kurmak için Vs Code eklentiler bölümünden “git history” şeklinde aratıp kurunuz. Eklentiyi kurduktan sonra klasörün kenarına görselde belirtilen saat ikonu gelecektir. Bu ikona tıklandığında o klasörde yapılan tüm işlemleri görmek mümkün. Yukarıda yaptığımız commiti şimdi Git History’den inceleyelim. Git history sayfası ikiye bölünmüştür. Üst kısımda yapılan commit işlemleri görünür. Biz bu klasör için henüz bir adet commit yaptığımız için bir commitimiz listelendi. Alt kısımda ise seçili commitin ayrıntıları yer alır. Bu ekrandaki mavi butonlardan birkaçının ne işe yaradığına bakalım: Soft ve hard: Bu iki işlem yaptığım commiti siler. Workspace: Dosyanın anlık durumu ile commit edilen halini karşılaştırır. Previous: Dosyanın bir önceki commiti ile seçili commitini karşılaştırır. Bu karşılaştırmalarda yapılan değişiklikler silinenler kırmızı, eklenenler yeşil olarak gösterilir. Şimdi klasöre örnek olması için yeni bir dosya ekliyorum ve tekrar commit ediyorum. Yukarıdaki gibi newfile.txt dosyasını ekledim ve “add new files” mesajıyla commit işlemini gerçekleştirdim. İkinci commitim history sayfamda listeye eklenmiş durumda. ","date":"10-22-2023","objectID":"/vs_code_git/:1:3","series":null,"tags":["github","git","VsCode"],"title":"Vs Code ile Git Kullanımı","uri":"/vs_code_git/#git-history"},{"categories":null,"content":" Githuba yükleme: Push ve remotecommit yaptıktan sonra seçili klasör için Source Control başlığı altında “Publish Branch” butonu oluşacaktır. Bu butona tıklandığında github üzerinde oluşturulacak deponun private yada public mi olması gerektiğini soracaktır. Biz public olanı seçip devam ettiğimizde yeni depo oluşturma, remote ve push olmak üzere bu üç işlemin tamamı otomatik olarak gerçekleştirilir. Publish Branch \u003e Public Github üzerinde oluşan yeni depo: ","date":"10-22-2023","objectID":"/vs_code_git/:1:4","series":null,"tags":["github","git","VsCode"],"title":"Vs Code ile Git Kullanımı","uri":"/vs_code_git/#githuba-yükleme-push-ve-remote"},{"categories":null,"content":" Diğer işlemler: Pull, clone, fetch, branch vs.Klasörün yanındaki üç noktadan diğer işlemlere ulaşabilirsiniz. ","date":"10-22-2023","objectID":"/vs_code_git/:1:5","series":null,"tags":["github","git","VsCode"],"title":"Vs Code ile Git Kullanımı","uri":"/vs_code_git/#diğer-işlemler-pull-clone-fetch-branch-vs"},{"categories":null,"content":" HugoHugo nedir: Hugo, Go dili ile yazılmış ve web sitesi oluşturmayı yeniden eğlenceli hale getirmek için tasarlanmış hızlı ve modern bir statik site oluşturucudur. Gereklilikler: Hugo’nun indiirlmesi Git‘in indiirlmesi ","date":"10-10-2023","objectID":"/hugo_ile_web_site/:1:0","series":null,"tags":["hugo","website"],"title":"Hugo ile Website Yapımı","uri":"/hugo_ile_web_site/#hugo"},{"categories":null,"content":" Windows için hugo indirmeChocolatey, Scoop veya Winget paket yöneticilerinden herhangi biri ile indiribeilirsiniz. komutlar: choco install hugo-extended scoop install hugo-extended winget install Hugo.Hugo.Extended ","date":"10-10-2023","objectID":"/hugo_ile_web_site/:1:1","series":null,"tags":["hugo","website"],"title":"Hugo ile Website Yapımı","uri":"/hugo_ile_web_site/#windows-için-hugo-indirme"},{"categories":null,"content":" Linux için hugo indirme Paket yöneticisine göre indirme komutları Snap ile indirme: sudo snap install hugo Homebrew ile indirme: brew install hugo ArchLinux dağıtımları için indirme: sudo pacman –S hugo Dabian dağıtımları için indirme: sudo apt install hugo Fedora için indirme: sudo dnf install hugo ","date":"10-10-2023","objectID":"/hugo_ile_web_site/:1:2","series":null,"tags":["hugo","website"],"title":"Hugo ile Website Yapımı","uri":"/hugo_ile_web_site/#linux-için-hugo-indirme"},{"categories":null,"content":" BaşlangıçWeb sitesini oluşturmaya başlamadan önce siteniz için bir tema seçmelisniz. Hugo web sitesinde seçebileceğiniz farklı tema tasarımları bulunur. Buradan temalara ulaşabilirsiniz. Yeni bir web sitesi oluşturma adımlarıTerminalinizi açın ve site klasörünüzü oluşturmak istediğiniz dizine gidin. Bundan sonra yapılması gereken aşağıdaki komutları sırasıyla girmek. Site Oluşturma hugo new site Site_ismi Site_ismi adında bir klasör oluşturarak projeye gerekli altyapıyı kurar. cd Site_ismi Klasörün içerisine girer. git init Klasörü git ile ilişkilendirir. git submodule add https://github.com/theNewDynamic/gohugo-theme-ananke.git themes/ananke Siteniz için seçtiğiniz temayı ekler. Burada örnek olarak ananke teması verilmiştir. Kırmızı ile belirtilen yere kendi temanızın github adresini ekeyin. Github temelleri için tıklayınız. echo \"theme = 'ananke'\" \u003e\u003e hugo.toml Hugo.toml dosyası sitenizin yapılandırma ayarlarının buunduğu dosyadır. Bu komutla temanızı bu dosyaya kaydetmiş olacaksınız. hugo server Hugo server komutu sitenizi görüntelemenize olanak sağlar. Görselde belirtilen linke tıklayarak sitenizin görünümünü inceleyebilirsiniz. ","date":"10-10-2023","objectID":"/hugo_ile_web_site/:2:0","series":null,"tags":["hugo","website"],"title":"Hugo ile Website Yapımı","uri":"/hugo_ile_web_site/#başlangıç"},{"categories":null,"content":" BaşlangıçWeb sitesini oluşturmaya başlamadan önce siteniz için bir tema seçmelisniz. Hugo web sitesinde seçebileceğiniz farklı tema tasarımları bulunur. Buradan temalara ulaşabilirsiniz. Yeni bir web sitesi oluşturma adımlarıTerminalinizi açın ve site klasörünüzü oluşturmak istediğiniz dizine gidin. Bundan sonra yapılması gereken aşağıdaki komutları sırasıyla girmek. Site Oluşturma hugo new site Site_ismi Site_ismi adında bir klasör oluşturarak projeye gerekli altyapıyı kurar. cd Site_ismi Klasörün içerisine girer. git init Klasörü git ile ilişkilendirir. git submodule add https://github.com/theNewDynamic/gohugo-theme-ananke.git themes/ananke Siteniz için seçtiğiniz temayı ekler. Burada örnek olarak ananke teması verilmiştir. Kırmızı ile belirtilen yere kendi temanızın github adresini ekeyin. Github temelleri için tıklayınız. echo \"theme = 'ananke'\" \u003e\u003e hugo.toml Hugo.toml dosyası sitenizin yapılandırma ayarlarının buunduğu dosyadır. Bu komutla temanızı bu dosyaya kaydetmiş olacaksınız. hugo server Hugo server komutu sitenizi görüntelemenize olanak sağlar. Görselde belirtilen linke tıklayarak sitenizin görünümünü inceleyebilirsiniz. ","date":"10-10-2023","objectID":"/hugo_ile_web_site/:2:0","series":null,"tags":["hugo","website"],"title":"Hugo ile Website Yapımı","uri":"/hugo_ile_web_site/#yeni-bir-web-sitesi-oluşturma-adımları"},{"categories":null,"content":" İçerik EklenmesiContent klasörünüz içeriklerinizin yer alacağı klasördür. Projenizin olduğu klasör içerisinde aşağıdaki komutla yeni bir post oluşturabilirsiniz. hugo new content posts/my-first-post.md Draft bölümün true olması içeriğin taslak olaak kaydedildiği ve görünmeyeceği anlamına gelir. İçeriği yayınlamak için draft’ı false yapın. İçerik kısmını markdown ile kolayca oluşturabilirsiniz. Markdown yazımı temelleri için tıklayınız. ","date":"10-10-2023","objectID":"/hugo_ile_web_site/:3:0","series":null,"tags":["hugo","website"],"title":"Hugo ile Website Yapımı","uri":"/hugo_ile_web_site/#içerik-eklenmesi"},{"categories":null,"content":" Ayarlar ve YayınlamaProjenizdeki hugo.toml dosyasının yapılandırma ayarlarını barındırdığını söylemiştik. Buradaki ayarları inceliyerek siteniz için gerekli olanları yapılandırabilirsiniz. Base url: burada example.org kısmını silerek sitenizin url sini ekleyin. Dil: Temanızdaki dil bölümünden dil kodunuzu yapıştırın. Türkçe için » tr Title: site başlığı Yayınlama:Hugo komutu : Bu komutu kök dizinde çalıştırdığınızda hugo public adında bir klasör oluşturur. Bu klasör mevcut sitenizin yayınlanmaya hazır html dosyalarıdır. Public Klasörünü yayınlayabilirsiniz. hugo ","date":"10-10-2023","objectID":"/hugo_ile_web_site/:4:0","series":null,"tags":["hugo","website"],"title":"Hugo ile Website Yapımı","uri":"/hugo_ile_web_site/#ayarlar-ve-yayınlama"},{"categories":null,"content":" Ayarlar ve YayınlamaProjenizdeki hugo.toml dosyasının yapılandırma ayarlarını barındırdığını söylemiştik. Buradaki ayarları inceliyerek siteniz için gerekli olanları yapılandırabilirsiniz. Base url: burada example.org kısmını silerek sitenizin url sini ekleyin. Dil: Temanızdaki dil bölümünden dil kodunuzu yapıştırın. Türkçe için » tr Title: site başlığı Yayınlama:Hugo komutu : Bu komutu kök dizinde çalıştırdığınızda hugo public adında bir klasör oluşturur. Bu klasör mevcut sitenizin yayınlanmaya hazır html dosyalarıdır. Public Klasörünü yayınlayabilirsiniz. hugo ","date":"10-10-2023","objectID":"/hugo_ile_web_site/:4:0","series":null,"tags":["hugo","website"],"title":"Hugo ile Website Yapımı","uri":"/hugo_ile_web_site/#yayınlama"},{"categories":null,"content":" Git ve Github TemelleriGithub nedir? Projelerin depolandığı ve paylaşıldığı bir servistir. Basite indirgemek istersek yazılım için üretilmiş bir sosyal medya platformu. Bu platformda projelerinizi paylaşabilirsiniz. Paylaşılan projeler üzerinde geliştirmeler yapabilirsiniz. Git nedir? Yerel projelerinizi github’a entegre etmenize ve yerel ile github arasında senkranizasyon sağlamanıza olanak veren yönetim sistemidir. ","date":"10-03-2023","objectID":"/git_github_temelleri/:1:0","series":null,"tags":["github","git"],"title":"Git ve Github Temelleri","uri":"/git_github_temelleri/#git-ve-github-temelleri"},{"categories":null,"content":" Kullanmaya Başlarken Gereklilikler Github üzerinde hesap oluşturulması Blgisayarınıza git indirilip kurulması Herhangi bir proje klasörü Projeniz basit bir html veya txt doyası bile olabilir. Burada amaç herhangi bir klasör olmasıdır. ","date":"10-03-2023","objectID":"/git_github_temelleri/:2:0","series":null,"tags":["github","git"],"title":"Git ve Github Temelleri","uri":"/git_github_temelleri/#kullanmaya-başlarken"},{"categories":null,"content":" Yereldeki Projeyi Github’a Yüklemek Github’ı hesabınıza girin ve yeni repository oluşturun. “Repositories \u003e new” deponuzun ismini girin ve “create” butonuna tıklayın. Repositories bölümünden oluşturduğunuz depoya tıklayın. Sağ üstteki yeşil code butonuna tıklayın ve depo adresinizi kopyalayın. Projenizin olduğu klasörü terminalde açın. (terminalde klasörünüzün içerisine girin) Sırasıyla şu komutları girin git init git add . gi commit –m “bir başlık yazın buraya herhangi bir şey olabilir” git remote add origin “kopyaladığınız_url “ (bu adımdan sonra github hesabınız ile eşleşme yapılması istenecektir. Adımları takip ederek hesabınızı eşleştirin.) git push –u origin master (master kabul edilmez ise main yazarak tekrar deneyin.) Bu adımlardan sonra yereldeki proje dosyalarınız github’da açtığınız bu yeni repository’ye yüklenmiş olacaktır. Yerelde yaptığınız değişiklikleri github üzerinde güncellemek için bu komutları birincisi ve dördüncüsü hariç aynı şekilde tekrarlayabilirsiniz. ","date":"10-03-2023","objectID":"/git_github_temelleri/:3:0","series":null,"tags":["github","git"],"title":"Git ve Github Temelleri","uri":"/git_github_temelleri/#yereldeki-projeyi-githuba-yüklemek"},{"categories":null,"content":" Github Üzerindeki Bir Projeyi Yerele ÇekmekGithub projelerini iki yöntemle bilgisayarınıza indirip kullanabilirsiniz. Burada git kullanarak nasıl yapacağınız anlatılmaktadır. Indirmek istediğiniz github projesini açın. Sağ üstteki yeşil clone butonuna tıklayın ve adresi kopyalayın. Terminalinizi açın Projeyi indirmek istediğiniz klasörünüze girin. Sırasıyla şu komutları girin git init git clone kopyaladığınız_url Proje klasörünüze indirilmiş olacaktır. ","date":"10-03-2023","objectID":"/git_github_temelleri/:4:0","series":null,"tags":["github","git"],"title":"Git ve Github Temelleri","uri":"/git_github_temelleri/#github-üzerindeki-bir-projeyi-yerele-çekmek"},{"categories":null,"content":"Bu yazıda Github hesabınızı nasıl hosting olarak kullanabileceğiniz anlatılacaktır","date":"09-30-2023","objectID":"/github_ucretsiz_hosting/","series":null,"tags":["github","website"],"title":"Github ile Ücretsiz Hosting","uri":"/github_ucretsiz_hosting/"},{"categories":null,"content":" Github ile Hosting ve Subdomain Alma RehberiGithub pages, kullanıcılarına ücretsiz hosting ve subdomain hizmeti sunar. Bu yazıda sizlere github ile ücretsiz hosting ve subdomain (alt alan adı) nasıl alınır, web site olarak nasıl kullanılır, özel domain (alan adı) github hosting servisine nasıl entegre edilir, sorularının cevabını adım adım açıklayacağım. Öncelikle konuya yeni giriş yapanlar için hosting, domain ve subdomain kavramlarını açıklamakla başlayalım. İnternette dolaşılan her web sitesinin domain ve hostingi olmak zorundadır. Domain tarayıcınızın adres çubuğunda gördüğünüz www ile başlayan kısımdır. Örneğin şuan www.gulsumturk.com web sitesindesiniz. Yani bu web sitesinin domaini (alan adı) gulsumturk.com oluyor. Hosting kavramı ise ilk defa duyanlar için biraz karmaşık gelebilir. Hostingi türkçeye depolama servisi olarak çevirebiliriz. Web site sayfalarının dosyalar halinde depolandığı yerdir. Bu bilgisayarlara server denir. Bir web sitesine 7/24 ulaşılabilinmesi için bu serverlar, sürekli çalışır durumda bulunurlar. İşte bu hizmet hosting olarak adlandırılır. Web site oluşturmak için hosting ve domain satın alabileceğiniz pek çok web sitesi bulunmaktadır. Ancak yazımızın konusu olan github Pages sayesinde bu iki hizmeti ücretsiz olarak elde etmemiz mümkün. Github kullanıcılarına, depolarını hosting olarak kullanmalarına ve githıb.io adresinde subdomain almalarına olanak tanır. Ancak burada sadece statik bir web sitesi oluştuma olanağı mevcut. Statik ve dinamik web sitesi hakkında detaylı bilgiyi buraya tıklayarak ilgili yazımdan öğrenebilirsiniz. Şimdi github üzerinden hangi adımları gerçekleştirmemiz gerektiğine bakalım. ","date":"09-30-2023","objectID":"/github_ucretsiz_hosting/:1:0","series":null,"tags":["github","website"],"title":"Github ile Ücretsiz Hosting","uri":"/github_ucretsiz_hosting/#github-ile-hosting-ve-subdomain-alma-rehberi"},{"categories":null,"content":" Github ile Website Oluşturma AdımlarıGithub üzerinden hosting ve subdomain hizmeti alabilmek için bir adet kullanıcı hasebınızın bulunuyor olması gerekir. Github ve git kullanımının detayları için ilgili yazımızı okuyabilirsiniz. Github hesabınıza giriş yapın ve yeni bir depo (Repository) oluşturun. Deponuza kullanıcı hesabınızın ismini birebir olarak aynı vermeniz gerekiyor. İsminizden sonra “.github.io” ekleyin Örnek \u003e Gulsum.github.io Tüm işlem bu kadar. Oluşturduğunuz depo ismi web sitenizin domaini yani alan adı deponuz ise hosting görevi görür. Deponun içerisine yüklenen html, css veya javascript dosyalarıyla siteyi oluşturmaya başlayabilirsiniz. ","date":"09-30-2023","objectID":"/github_ucretsiz_hosting/:1:1","series":null,"tags":["github","website"],"title":"Github ile Ücretsiz Hosting","uri":"/github_ucretsiz_hosting/#github-ile-website-oluşturma-adımları"},{"categories":null,"content":" Özel Alan Adını Github Hosting Servisine Entegre EtmeYukarıda bahsedilen şekilde alınan domain subdomaindir. Yani web sitenin adresi example.github.io şeklinde olur. Bunun yerine kendi aldığınız özel alan adını kullanmayı tercih edebilirsiniz. Sitenize özel bir alan adını kullanmak sayfanızın daha profesyonel görünmesinde etkili bir faktördür. Aşağıdaki adımları takip ederek oluşturduğunuz github deponuza özel alan adını entegre edebilirsiniz. Deponuzu açın ve ayarlar sayfasına gidin. Sol tarafta bulunan menüden “Pages” a tıklayın. Altta bulunan Custom Domain kısmına kendi özel alan adınızı girin. Örnek \u003e gulsumturk.com 4. Learn more about configuring custum domain \u003e Managing a custom domain for your GitHub Pages site adreslerini takip edin. Bu sayfada özel alan adınızı GitHub ile nasıl birleştireceğiniz detaylı olarak anlatılıyor. 5. Domanin alındığı web sitesine gidin ve hesabınıza girin. Aşağıdaki örnek, Google Domains üzerinden anlatılmıştır. Alan adınızı yönete tıklayın. Sol taraftaki menüden DNS’e tıklayın. “Özel kayıtları yönet” e tıklayın. “yeni kayıt oluştur” a tıklayın. Görseldeki gibi ana makine adına “www”, tür kısmına CNAME, TTL = 600, veriler bölümüne GitHub subdomaininizi girin ve kaydete tıklayın. Yeni kayıt oluştura tekrar tıklayın ve bu sefer tür olarak A seçeneğini seçin. Ana makine adını boş bırakın. Veriler kısmına managing sayfasındaki apex domain başlığının altında bulunan ip adreslerini “bu kayda daha fazla ekle” butonunu kullanarak sırayla ekleyin ve kaydedin. Bu işlemlerden sonra özel alan adınız ile GitHub sayfanız eşleşmiş olacaktır. ","date":"09-30-2023","objectID":"/github_ucretsiz_hosting/:1:2","series":null,"tags":["github","website"],"title":"Github ile Ücretsiz Hosting","uri":"/github_ucretsiz_hosting/#özel-alan-adını-github-hosting-servisine-entegre-etme"},{"categories":null,"content":"arch tabanlı linux dağıtımlarında temel terminal komutları 1","date":"09-30-2023","objectID":"/arch_dagitimlarinda_paket_yoneticisi/","series":null,"tags":["Linux","Arch","Paket Yöneticisi"],"title":"Linux Arch Dağıtımlarında Paket Yöneticisi Kullanımı","uri":"/arch_dagitimlarinda_paket_yoneticisi/"},{"categories":null,"content":" Arch paket yöneticisiPacman (package manager) archlinux ve dağıtımları için kullanılan paket yöneticisidir. Terminal kullanarak paket indirme, kaldırma, güncelleme işlemlerini yapılmasına olanak verir. Paket İndirme Pacman ile paket indirme komutu pacman –S paket_ismi Paket ismi kurmak istediğiniz programın archlinux deposundaki ismidir. Bu depoya https://archlinux.org/packages/ adresinden ulaşabilirsiniz. Paket Kaldırma Pacman ile paket kaldırma komutu pacman –R paket_ismi Paket Güncelleme Pacman ile paket Güncelleme komutu pacman –Syu paket_ismi Bu komutla tüm paketlerinizi güncelleyebilirsiniz. Paketlerinize tek tek güncelleme yapmanıza arch tabanlı dağıtımlarda destek verilmez. Daha fazla bilgi için » https://wiki.archlinux.org/title/System_maintenance#Upgrading_the_system Paket Arama Bu komutla ismini tam olarak bilmediğiniz bir paketi depoda arayabilir ve ilgili paketleri listeleyebilirsiniz pacman –Ss paket_ismi Paket veritabanı üzerinde sorgulama yapmak için kullanılan parametreler: –S –F –Q Detaylı bilgi » https://wiki.archlinux.org/title/pacman#Querying_package_databases ","date":"09-30-2023","objectID":"/arch_dagitimlarinda_paket_yoneticisi/:1:0","series":null,"tags":["Linux","Arch","Paket Yöneticisi"],"title":"Linux Arch Dağıtımlarında Paket Yöneticisi Kullanımı","uri":"/arch_dagitimlarinda_paket_yoneticisi/#arch-paket-yöneticisi"},{"categories":null,"content":" Aur (Arch User repository) KullanımıAur arch kullanıcı havuzu olarak tanımlanır. Bu havuzda kullanıcıların oluşturduğu paketler yer alır. Bu sebeple arch paket havuzundan daha fazla seçenek sunar. Örneğin zoom uygulaması aur içerisinde varken arch havuzunda yoktur. Ancak buradaki paketleri pacman komutuyla doğrudan indirmek mümkün değildir. Aur paketlerini aur yardımcı komutlarıyla veya veya pacman’e ek olarak makepkg komutuyla indirebilirsiniz. yazıda pacman wrappers olarak bilinen yay ile aurdan paket indirme yöntemi anlatılacaktır. Konu hakkında daha fazla bilgi için » https://wiki.archlinux.org/title/AUR_helpers#Pacman_wrappers Yay Kurulumu Yay kurulumu için sırasıyla girilmesi gereken komutlar: sudo pacman -S --needed git base-devel git clone https://aur.archlinux.org/yay.git cd yay makepkg -si Bu işlemlerden sonra yay kurulmuş olacaktır. ","date":"09-30-2023","objectID":"/arch_dagitimlarinda_paket_yoneticisi/:2:0","series":null,"tags":["Linux","Arch","Paket Yöneticisi"],"title":"Linux Arch Dağıtımlarında Paket Yöneticisi Kullanımı","uri":"/arch_dagitimlarinda_paket_yoneticisi/#aur-arch-user-repository-kullanımı"},{"categories":null,"content":" Yay ile paket indirme ve bazı komutlar: Aur paketlerini bu web sitesinden bulabilirsiniz » https://aur.archlinux.org/packages Yay –S paket_ismi »\u003e aur paketini indirir ve kurar Yay –R paket_ismi »\u003e paketi siler Yay –Syu » paketleri günceller yay –version » versiyonunu söyler yay -Ss packagename » o isimde veya benzer aur deposunda bulunan tüm paketleri listeler Yay –Sc veya yay –Scc » yüklü paketlerin önbellekte kapladığı alanı ve gereksiz dosyalarını siler. Yani ön bellek temizliği yapar. Yay –ps » yüklü paketler hakkında bilgi verir. Detaylı bilgi » yay –help , pacman –help ","date":"09-30-2023","objectID":"/arch_dagitimlarinda_paket_yoneticisi/:2:1","series":null,"tags":["Linux","Arch","Paket Yöneticisi"],"title":"Linux Arch Dağıtımlarında Paket Yöneticisi Kullanımı","uri":"/arch_dagitimlarinda_paket_yoneticisi/#yay-ile-paket-indirme-ve-bazı-komutlar"},{"categories":["documentation"],"content":"This article shows the basic Markdown syntax and format.","date":"12-01-2019","objectID":"/iki/","series":null,"tags":["Markdown","HTML"],"title":"Basic Markdown Syntax","uri":"/iki/"},{"categories":["documentation"],"content":"This article offers a sample of basic Markdown syntax that can be used in Hugo content files. Not This article is a shameful copy of the great Grav original page. If you want to know about the extended Markdown syntax of DoIt theme, please read extended Markdown syntax page. Let’s face it: Writing content for the Web is tiresome. WYSIWYG editors help alleviate this task, but they generally result in horrible code, or worse yet, ugly web pages. Markdown is a better way to write HTML, without all the complexities and ugliness that usually accompanies it. Some of the key benefits are: Markdown is simple to learn, with minimal extra characters, so it’s also quicker to write content. Less chance of errors when writing in Markdown. Produces valid XHTML output. Keeps the content and the visual display separate, so you cannot mess up the look of your site. Write in any text editor or Markdown application you like. Markdown is a joy to use! John Gruber, the author of Markdown, puts it like this: The overriding design goal for Markdown’s formatting syntax is to make it as readable as possible. The idea is that a Markdown-formatted document should be publishable as-is, as plain text, without looking like it’s been marked up with tags or formatting instructions. While Markdown’s syntax has been influenced by several existing text-to-HTML filters, the single biggest source of inspiration for Markdown’s syntax is the format of plain text email. – John Gruber Without further delay, let us go over the main elements of Markdown and what the resulting HTML looks like! İpucu Bookmark this page for easy future reference! ","date":"12-01-2019","objectID":"/iki/:0:0","series":null,"tags":["Markdown","HTML"],"title":"Basic Markdown Syntax","uri":"/iki/#"},{"categories":["documentation"],"content":" HeadingsHeadings from h2 through h6 are constructed with a # for each level: ## h2 Heading ### h3 Heading #### h4 Heading ##### h5 Heading ###### h6 Heading The HTML looks like this: \u003ch2\u003eh2 Heading\u003c/h2\u003e \u003ch3\u003eh3 Heading\u003c/h3\u003e \u003ch4\u003eh4 Heading\u003c/h4\u003e \u003ch5\u003eh5 Heading\u003c/h5\u003e \u003ch6\u003eh6 Heading\u003c/h6\u003e Heading IDs To add a custom heading ID, enclose the custom ID in curly braces on the same line as the heading: ### A Great Heading {#custom-id} The HTML looks like this: \u003ch3 id=\"custom-id\"\u003eA Great Heading\u003c/h3\u003e ","date":"12-01-2019","objectID":"/iki/:1:0","series":null,"tags":["Markdown","HTML"],"title":"Basic Markdown Syntax","uri":"/iki/#headings"},{"categories":["documentation"],"content":" CommentsComments should be HTML compatible. \u003c!-- This is a comment --\u003e Comment below should NOT be seen: ","date":"12-01-2019","objectID":"/iki/:2:0","series":null,"tags":["Markdown","HTML"],"title":"Basic Markdown Syntax","uri":"/iki/#comments"},{"categories":["documentation"],"content":" Horizontal RulesThe HTML \u003chr\u003e element is for creating a “thematic break” between paragraph-level elements. In Markdown, you can create a \u003chr\u003e with any of the following: ___: three consecutive underscores ---: three consecutive dashes ***: three consecutive asterisks The rendered output looks like this: ","date":"12-01-2019","objectID":"/iki/:3:0","series":null,"tags":["Markdown","HTML"],"title":"Basic Markdown Syntax","uri":"/iki/#horizontal-rules"},{"categories":["documentation"],"content":" Body CopyBody copy written as normal, plain text will be wrapped with \u003cp\u003e\u003c/p\u003e tags in the rendered HTML. So this body copy: Lorem ipsum dolor sit amet, graecis denique ei vel, at duo primis mandamus. Et legere ocurreret pri, animal tacimates complectitur ad cum. Cu eum inermis inimicus efficiendi. Labore officiis his ex, soluta officiis concludaturque ei qui, vide sensibus vim ad. The HTML looks like this: \u003cp\u003eLorem ipsum dolor sit amet, graecis denique ei vel, at duo primis mandamus. Et legere ocurreret pri, animal tacimates complectitur ad cum. Cu eum inermis inimicus efficiendi. Labore officiis his ex, soluta officiis concludaturque ei qui, vide sensibus vim ad.\u003c/p\u003e A line break can be done with one blank line. ","date":"12-01-2019","objectID":"/iki/:4:0","series":null,"tags":["Markdown","HTML"],"title":"Basic Markdown Syntax","uri":"/iki/#body-copy"},{"categories":["documentation"],"content":" Inline HTMLIf you need a certain HTML tag (with a class) you can simply use HTML: Paragraph in Markdown. \u003cdiv class=\"class\"\u003e This is \u003cb\u003eHTML\u003c/b\u003e \u003c/div\u003e Paragraph in Markdown. ","date":"12-01-2019","objectID":"/iki/:5:0","series":null,"tags":["Markdown","HTML"],"title":"Basic Markdown Syntax","uri":"/iki/#inline-html"},{"categories":["documentation"],"content":" Emphasis","date":"12-01-2019","objectID":"/iki/:6:0","series":null,"tags":["Markdown","HTML"],"title":"Basic Markdown Syntax","uri":"/iki/#emphasis"},{"categories":["documentation"],"content":" BoldFor emphasizing a snippet of text with a heavier font-weight. The following snippet of text is rendered as bold text. **rendered as bold text** __rendered as bold text__ The HTML looks like this: \u003cstrong\u003erendered as bold text\u003c/strong\u003e ","date":"12-01-2019","objectID":"/iki/:6:1","series":null,"tags":["Markdown","HTML"],"title":"Basic Markdown Syntax","uri":"/iki/#bold"},{"categories":["documentation"],"content":" ItalicsFor emphasizing a snippet of text with italics. The following snippet of text is rendered as italicized text. *rendered as italicized text* _rendered as italicized text_ The HTML looks like this: \u003cem\u003erendered as italicized text\u003c/em\u003e ","date":"12-01-2019","objectID":"/iki/:6:2","series":null,"tags":["Markdown","HTML"],"title":"Basic Markdown Syntax","uri":"/iki/#italics"},{"categories":["documentation"],"content":" StrikethroughIn GFMGitHub flavored Markdown you can do strikethroughs. ~~Strike through this text.~~ The rendered output looks like this: Strike through this text. The HTML looks like this: \u003cdel\u003eStrike through this text.\u003c/del\u003e ","date":"12-01-2019","objectID":"/iki/:6:3","series":null,"tags":["Markdown","HTML"],"title":"Basic Markdown Syntax","uri":"/iki/#strikethrough"},{"categories":["documentation"],"content":" CombinationBold, italics, and strikethrough can be used in combination. ***bold and italics*** ~~**strikethrough and bold**~~ ~~*strikethrough and italics*~~ ~~***bold, italics and strikethrough***~~ The rendered output looks like this: bold and italics strikethrough and bold strikethrough and italics bold, italics and strikethrough The HTML looks like this: \u003cem\u003e\u003cstrong\u003ebold and italics\u003c/strong\u003e\u003c/em\u003e \u003cdel\u003e\u003cstrong\u003estrikethrough and bold\u003c/strong\u003e\u003c/del\u003e \u003cdel\u003e\u003cem\u003estrikethrough and italics\u003c/em\u003e\u003c/del\u003e \u003cdel\u003e\u003cem\u003e\u003cstrong\u003ebold, italics and strikethrough\u003c/strong\u003e\u003c/em\u003e\u003c/del\u003e ","date":"12-01-2019","objectID":"/iki/:6:4","series":null,"tags":["Markdown","HTML"],"title":"Basic Markdown Syntax","uri":"/iki/#combination"},{"categories":["documentation"],"content":" BlockquotesFor quoting blocks of content from another source within your document. Add \u003e before any text you want to quote: \u003e **Fusion Drive** combines a hard drive with a flash storage (solid-state drive) and presents it as a single logical volume with the space of both drives combined. The rendered output looks like this: Fusion Drive combines a hard drive with a flash storage (solid-state drive) and presents it as a single logical volume with the space of both drives combined. The HTML looks like this: \u003cblockquote\u003e \u003cp\u003e \u003cstrong\u003eFusion Drive\u003c/strong\u003e combines a hard drive with a flash storage (solid-state drive) and presents it as a single logical volume with the space of both drives combined. \u003c/p\u003e \u003c/blockquote\u003e Blockquotes can also be nested: \u003e Donec massa lacus, ultricies a ullamcorper in, fermentum sed augue. Nunc augue augue, aliquam non hendrerit ac, commodo vel nisi. \u003e\u003e Sed adipiscing elit vitae augue consectetur a gravida nunc vehicula. Donec auctor odio non est accumsan facilisis. Aliquam id turpis in dolor tincidunt mollis ac eu diam. The rendered output looks like this: Donec massa lacus, ultricies a ullamcorper in, fermentum sed augue. Nunc augue augue, aliquam non hendrerit ac, commodo vel nisi. Sed adipiscing elit vitae augue consectetur a gravida nunc vehicula. Donec auctor odio non est accumsan facilisis. Aliquam id turpis in dolor tincidunt mollis ac eu diam. ","date":"12-01-2019","objectID":"/iki/:7:0","series":null,"tags":["Markdown","HTML"],"title":"Basic Markdown Syntax","uri":"/iki/#blockquotes"},{"categories":["documentation"],"content":" Lists","date":"12-01-2019","objectID":"/iki/:8:0","series":null,"tags":["Markdown","HTML"],"title":"Basic Markdown Syntax","uri":"/iki/#lists"},{"categories":["documentation"],"content":" UnorderedA list of items in which the order of the items does not explicitly matter. You may use any of the following symbols to denote bullets for each list item: * valid bullet - valid bullet + valid bullet For example: * Lorem ipsum dolor sit amet * Consectetur adipiscing elit * Integer molestie lorem at massa * Facilisis in pretium nisl aliquet * Nulla volutpat aliquam velit * Phasellus iaculis neque * Purus sodales ultricies * Vestibulum laoreet porttitor sem * Ac tristique libero volutpat at * Faucibus porta lacus fringilla vel * Aenean sit amet erat nunc * Eget porttitor lorem The rendered output looks like this: Lorem ipsum dolor sit amet Consectetur adipiscing elit Integer molestie lorem at massa Facilisis in pretium nisl aliquet Nulla volutpat aliquam velit Phasellus iaculis neque Purus sodales ultricies Vestibulum laoreet porttitor sem Ac tristique libero volutpat at Faucibus porta lacus fringilla vel Aenean sit amet erat nunc Eget porttitor lorem The HTML looks like this: \u003cul\u003e \u003cli\u003eLorem ipsum dolor sit amet\u003c/li\u003e \u003cli\u003eConsectetur adipiscing elit\u003c/li\u003e \u003cli\u003eInteger molestie lorem at massa\u003c/li\u003e \u003cli\u003eFacilisis in pretium nisl aliquet\u003c/li\u003e \u003cli\u003eNulla volutpat aliquam velit \u003cul\u003e \u003cli\u003ePhasellus iaculis neque\u003c/li\u003e \u003cli\u003ePurus sodales ultricies\u003c/li\u003e \u003cli\u003eVestibulum laoreet porttitor sem\u003c/li\u003e \u003cli\u003eAc tristique libero volutpat at\u003c/li\u003e \u003c/ul\u003e \u003c/li\u003e \u003cli\u003eFaucibus porta lacus fringilla vel\u003c/li\u003e \u003cli\u003eAenean sit amet erat nunc\u003c/li\u003e \u003cli\u003eEget porttitor lorem\u003c/li\u003e \u003c/ul\u003e ","date":"12-01-2019","objectID":"/iki/:8:1","series":null,"tags":["Markdown","HTML"],"title":"Basic Markdown Syntax","uri":"/iki/#unordered"},{"categories":["documentation"],"content":" OrderedA list of items in which the order of items does explicitly matter. 1. Lorem ipsum dolor sit amet 2. Consectetur adipiscing elit 3. Integer molestie lorem at massa 4. Facilisis in pretium nisl aliquet 5. Nulla volutpat aliquam velit 6. Faucibus porta lacus fringilla vel 7. Aenean sit amet erat nunc 8. Eget porttitor lorem The rendered output looks like this: Lorem ipsum dolor sit amet Consectetur adipiscing elit Integer molestie lorem at massa Facilisis in pretium nisl aliquet Nulla volutpat aliquam velit Faucibus porta lacus fringilla vel Aenean sit amet erat nunc Eget porttitor lorem The HTML looks like this: \u003col\u003e \u003cli\u003eLorem ipsum dolor sit amet\u003c/li\u003e \u003cli\u003eConsectetur adipiscing elit\u003c/li\u003e \u003cli\u003eInteger molestie lorem at massa\u003c/li\u003e \u003cli\u003eFacilisis in pretium nisl aliquet\u003c/li\u003e \u003cli\u003eNulla volutpat aliquam velit\u003c/li\u003e \u003cli\u003eFaucibus porta lacus fringilla vel\u003c/li\u003e \u003cli\u003eAenean sit amet erat nunc\u003c/li\u003e \u003cli\u003eEget porttitor lorem\u003c/li\u003e \u003c/ol\u003e İpucu If you just use 1. for each number, Markdown will automatically number each item. For example: 1. Lorem ipsum dolor sit amet 1. Consectetur adipiscing elit 1. Integer molestie lorem at massa 1. Facilisis in pretium nisl aliquet 1. Nulla volutpat aliquam velit 1. Faucibus porta lacus fringilla vel 1. Aenean sit amet erat nunc 1. Eget porttitor lorem The rendered output looks like this: Lorem ipsum dolor sit amet Consectetur adipiscing elit Integer molestie lorem at massa Facilisis in pretium nisl aliquet Nulla volutpat aliquam velit Faucibus porta lacus fringilla vel Aenean sit amet erat nunc Eget porttitor lorem ","date":"12-01-2019","objectID":"/iki/:8:2","series":null,"tags":["Markdown","HTML"],"title":"Basic Markdown Syntax","uri":"/iki/#ordered"},{"categories":["documentation"],"content":" Task ListsTask lists allow you to create a list of items with checkboxes. To create a task list, add dashes (-) and brackets with a space ([ ]) before task list items. To select a checkbox, add an x in between the brackets ([x]). - [x] Write the press release - [ ] Update the website - [ ] Contact the media The rendered output looks like this: Write the press release Update the website Contact the media ","date":"12-01-2019","objectID":"/iki/:8:3","series":null,"tags":["Markdown","HTML"],"title":"Basic Markdown Syntax","uri":"/iki/#task-lists"},{"categories":["documentation"],"content":" Code","date":"12-01-2019","objectID":"/iki/:9:0","series":null,"tags":["Markdown","HTML"],"title":"Basic Markdown Syntax","uri":"/iki/#code"},{"categories":["documentation"],"content":" Inline CodeWrap inline snippets of code with `. In this example, `\u003csection\u003e\u003c/section\u003e` should be wrapped as **code**. The rendered output looks like this: In this example, \u003csection\u003e\u003c/section\u003e should be wrapped as code. The HTML looks like this: \u003cp\u003e In this example, \u003ccode\u003e\u0026lt;section\u0026gt;\u0026lt;/section\u0026gt;\u003c/code\u003e should be wrapped with \u003cstrong\u003ecode\u003c/strong\u003e. \u003c/p\u003e ","date":"12-01-2019","objectID":"/iki/:9:1","series":null,"tags":["Markdown","HTML"],"title":"Basic Markdown Syntax","uri":"/iki/#inline-code"},{"categories":["documentation"],"content":" Indented CodeOr indent several lines of code by at least four spaces, as in: // Some comments line 1 of code line 2 of code line 3 of code The rendered output looks like this: // Some comments line 1 of code line 2 of code line 3 of code The HTML looks like this: \u003cpre\u003e \u003ccode\u003e // Some comments line 1 of code line 2 of code line 3 of code \u003c/code\u003e \u003c/pre\u003e ","date":"12-01-2019","objectID":"/iki/:9:2","series":null,"tags":["Markdown","HTML"],"title":"Basic Markdown Syntax","uri":"/iki/#indented-code"},{"categories":["documentation"],"content":" Block Fenced CodeUse “fences” ``` to block in multiple lines of code with a language attribute. ```markdown Sample text here... ``` The HTML looks like this: \u003cpre language-html\u003e \u003ccode\u003eSample text here...\u003c/code\u003e \u003c/pre\u003e ","date":"12-01-2019","objectID":"/iki/:9:3","series":null,"tags":["Markdown","HTML"],"title":"Basic Markdown Syntax","uri":"/iki/#block-fenced-code"},{"categories":["documentation"],"content":" Syntax HighlightingGFMGitHub Flavored Markdown also supports syntax highlighting. To activate it, simply add the file extension of the language you want to use directly after the first code “fence”, ```js, and syntax highlighting will automatically be applied in the rendered HTML. For example, to apply syntax highlighting to JavaScript code: ```js grunt.initConfig({ assemble: { options: { assets: 'docs/assets', data: 'src/data/*.{json,yml}', helpers: 'src/custom-helpers.js', partials: ['src/partials/**/*.{hbs,md}'] }, pages: { options: { layout: 'default.hbs' }, files: { './': ['src/templates/pages/index.hbs'] } } } }; ``` The rendered output looks like this: grunt.initConfig({ assemble: { options: { assets: 'docs/assets', data: 'src/data/*.{json,yml}', helpers: 'src/custom-helpers.js', partials: ['src/partials/**/*.{hbs,md}'] }, pages: { options: { layout: 'default.hbs' }, files: { './': ['src/templates/pages/index.hbs'] } } } }; Not Syntax highlighting page in Hugo Docs introduces more about syntax highlighting, including highlight shortcode. ","date":"12-01-2019","objectID":"/iki/:9:4","series":null,"tags":["Markdown","HTML"],"title":"Basic Markdown Syntax","uri":"/iki/#syntax-highlighting"},{"categories":["documentation"],"content":" TablesTables are created by adding pipes as dividers between each cell, and by adding a line of dashes (also separated by bars) beneath the header. Note that the pipes do not need to be vertically aligned. | Option | Description | | ------ | ----------- | | data | path to data files to supply the data that will be passed into templates. | | engine | engine to be used for processing templates. Handlebars is the default. | | ext | extension to be used for dest files. | The rendered output looks like this: Option Description data path to data files to supply the data that will be passed into templates. engine engine to be used for processing templates. Handlebars is the default. ext extension to be used for dest files. The HTML looks like this: \u003ctable\u003e \u003cthead\u003e \u003ctr\u003e \u003cth\u003eOption\u003c/th\u003e \u003cth\u003eDescription\u003c/th\u003e \u003c/tr\u003e \u003c/thead\u003e \u003ctbody\u003e \u003ctr\u003e \u003ctd\u003edata\u003c/td\u003e \u003ctd\u003epath to data files to supply the data that will be passed into templates.\u003c/td\u003e \u003c/tr\u003e \u003ctr\u003e \u003ctd\u003eengine\u003c/td\u003e \u003ctd\u003eengine to be used for processing templates. Handlebars is the default.\u003c/td\u003e \u003c/tr\u003e \u003ctr\u003e \u003ctd\u003eext\u003c/td\u003e \u003ctd\u003eextension to be used for dest files.\u003c/td\u003e \u003c/tr\u003e \u003c/tbody\u003e \u003c/table\u003e Right or center aligned text Adding a colon on the right side of the dashes below any heading will right align text for that column. Adding colons on both sides of the dashes below any heading will center align text for that column. | Option | Description | |:------:| -----------:| | data | path to data files to supply the data that will be passed into templates. | | engine | engine to be used for processing templates. Handlebars is the default. | | ext | extension to be used for dest files. | The rendered output looks like this: Option Description data path to data files to supply the data that will be passed into templates. engine engine to be used for processing templates. Handlebars is the default. ext extension to be used for dest files. ","date":"12-01-2019","objectID":"/iki/:10:0","series":null,"tags":["Markdown","HTML"],"title":"Basic Markdown Syntax","uri":"/iki/#tables"},{"categories":["documentation"],"content":" Links","date":"12-01-2019","objectID":"/iki/:11:0","series":null,"tags":["Markdown","HTML"],"title":"Basic Markdown Syntax","uri":"/iki/#links"},{"categories":["documentation"],"content":" Basic Link \u003chttps://assemble.io\u003e \[email protected]\u003e [Assemble](https://assemble.io) The rendered output looks like this (hover over the link, there is no tooltip): https://assemble.io [email protected] Assemble The HTML looks like this: \u003ca href=\"https://assemble.io\"\u003ehttps://assemble.io\u003c/a\u003e \u003ca href=\"mailto:[email protected]\"\[email protected]\u003c/a\u003e \u003ca href=\"https://assemble.io\"\u003eAssemble\u003c/a\u003e ","date":"12-01-2019","objectID":"/iki/:11:1","series":null,"tags":["Markdown","HTML"],"title":"Basic Markdown Syntax","uri":"/iki/#basic-link"},{"categories":["documentation"],"content":" Add a Title [Upstage](https://github.com/upstage/ \"Visit Upstage!\") The rendered output looks like this (hover over the link, there should be a tooltip): Upstage The HTML looks like this: \u003ca href=\"https://github.com/upstage/\" title=\"Visit Upstage!\"\u003eUpstage\u003c/a\u003e ","date":"12-01-2019","objectID":"/iki/:11:2","series":null,"tags":["Markdown","HTML"],"title":"Basic Markdown Syntax","uri":"/iki/#add-a-title"},{"categories":["documentation"],"content":" Named AnchorsNamed anchors enable you to jump to the specified anchor point on the same page. For example, each of these chapters: ## Table of Contents * [Chapter 1](#chapter-1) * [Chapter 2](#chapter-2) * [Chapter 3](#chapter-3) will jump to these sections: ## Chapter 1 \u003ca id=\"chapter-1\"\u003e\u003c/a\u003e Content for chapter one. ## Chapter 2 \u003ca id=\"chapter-2\"\u003e\u003c/a\u003e Content for chapter one. ## Chapter 3 \u003ca id=\"chapter-3\"\u003e\u003c/a\u003e Content for chapter one. Not The specific placement of the anchor tag seems to be arbitrary. They are placed inline here since it seems to be unobtrusive, and it works. ","date":"12-01-2019","objectID":"/iki/:11:3","series":null,"tags":["Markdown","HTML"],"title":"Basic Markdown Syntax","uri":"/iki/#named-anchors"},{"categories":["documentation"],"content":" FootnotesFootnotes allow you to add notes and references without cluttering the body of the document. When you create a footnote, a superscript number with a link appears where you added the footnote reference. Readers can click the link to jump to the content of the footnote at the bottom of the page. To create a footnote reference, add a caret and an identifier inside brackets ([^1]). Identifiers can be numbers or words, but they can’t contain spaces or tabs. Identifiers only correlate the footnote reference with the footnote itself — in the output, footnotes are numbered sequentially. Add the footnote using another caret and number inside brackets with a colon and text ([^1]: My footnote.). You don’t have to put footnotes at the end of the document. You can put them anywhere except inside other elements like lists, block quotes, and tables. This is a digital footnote[^1]. This is a footnote with \"label\"[^label] [^1]: This is a digital footnote [^label]: This is a footnote with \"label\" This is a digital footnote1. This is a footnote with “label”2 ","date":"12-01-2019","objectID":"/iki/:12:0","series":null,"tags":["Markdown","HTML"],"title":"Basic Markdown Syntax","uri":"/iki/#footnotes"},{"categories":["documentation"],"content":" ImagesImages have a similar syntax to links but include a preceding exclamation point. ![Minion](https://octodex.github.com/images/minion.png) or: ![Alt text](https://octodex.github.com/images/stormtroopocat.jpg \"The Stormtroopocat\") The Stormtroopocat Like links, images also have a footnote style syntax: ![Alt text][id] The Dojocat With a reference later in the document defining the URL location: [id]: https://octodex.github.com/images/dojocat.jpg \"The Dojocat\" İpucu DoIt theme has special shortcode for image, which provides more features. This is a digital footnote ↩︎ This is a footnote with “label” ↩︎ ","date":"12-01-2019","objectID":"/iki/:13:0","series":null,"tags":["Markdown","HTML"],"title":"Basic Markdown Syntax","uri":"/iki/#images"}]