Korzystasz z Discorda? Wstawiasz projekty na GitHuba? A może prowadzisz bloga?
Jeśli odpowiedź brzmi „tak” – musisz poznać prosty i genialny Markdown!
🤔 Co to jest Markdown?
Markdown to prosty i intuicyjny język znaczników, który pozwala Ci formatować tekst bez skomplikowanego kodu.
Na naukę MD wystarczy poświęcić dosłownie kilka minut.
Pliki Markdown zapisuje się zazwyczaj z rozszerzeniem .md
(być może spotkałeś się na GitHub z plikami README.md).
Dzięki MD, opisy projektów są ładne i czytelne.
Z tego prostego formatowania można też korzystać w wielu aplikacjach (Discord, Bear itd.) co przydaje się przy pisaniu długich wiadomości czy organizowaniu treści.
⚙️ Jak działa Markdown?
📖 Nagłówki
Nagłówki tworzymy za pomocą symbolu #
.
Liczba symboli określa poziom nagłówka.
# Nagłówek 1 (odpowiednik <h1> w HTML)
## Nagłówek 2
### Nagłówek 3
Zwróć uwagę na spację między #, a tekstem!
✍🏻 Tekst pogrubiony i kursywa
- Pogrubienie:
**tekst**
lub__tekst__
- Kursywa:
*tekst*
lub_tekst_
- Kursywa i pogrubienie:
***tekst***
📝 Listy
Lista punktowa:
- Punkt 1
- Punkt 2
- Podpunkt (na początku mamy Tab lub dwie spacje)
Efekt:
- Punkt 1
- Punkt 2
- Podpunkt
Lista numerowana:
1. Punkt pierwszy
2. Punkt drugi
3. Punkt trzeci
Efekt:
- Punkt pierwszy
- Punkt drugi
- Punkt trzeci
🌍 Linki
Aby dodać link, używamy składni: [tekst](adres_url)
Przykład: [MMC School](https://mmcschool.pl)
Efekt: MMC School
🖼️ Obrazy
Obrazy wstawiamy podobnie jak linki, z tym że na początku dodajemy wykrzyknik:

Ciekawostka – na Discordzie można pominąć wykrzyknik.
🗣️ Cytaty
Cytaty w Markdown oznaczamy znakiem >
:
> To jest cytat.
👾 Kod
Do osadzenia kodu używamy grawisów (ten cosiek pod Esc, przy tyldzie ~) i możemy to robić na dwa sposoby.
Sposób 1 (kod jednoliniowy):
`console.log("Cześć!")`
Efekt: console.log("Cześć!")
Sposób 2 (kod wieloliniowy):
```js
console.log("Cześć!")
console.log("🙂")
```
Efekt:

Zauważ, że w powyższym przykładzie za ```
dodałem litery js.
Dzięki temu kod jest odpowiednio pokolorowany.
Zamiast js możesz tam wstawić html, css, json itd. Odpowiednio dla używanego języka. 🙂
I to tyle! Właśnie nauczyłeś się korzystać z Markdown! 🥳
Nowe umiejętności możesz przetestować na naszym Discordzie, na GitHubie czy w VS Code (tylko pamiętaj o pliku .md
).
Przykład pliku Markdown:
# Nagłówek nr 1, tytuł projektu
## Nagłówek nr 2, nazwa sekcji
To jest jakiś losowy tekst.
Teraz dodamy listę:
- W tym punkcje mamy **pogrubione** jedno słowo!
- A to drugi punkt z [linkiem do strony MMC School](https://mmcschool.pl/)
> Teraz dodam jeszcze cytat.
A na końcu przykład kodu wieloliniowego:
```html
<h1>Hello world!</h1>
<p>Mam nadzieję, że poradnik się podobał. 🙂</p>
```
Powyższy kod możesz wkleić do pliku .md
, np. info.md
Następnie otwórz plik w VS Code, kliknij PPM (prawy przycisk myszy) i wybierz pierwszą opcję Open Preview.

Teraz masz podgląd na żywo prosto w VS Code. 👌🏻