# Notatki w Rich Text a Markdown: Jak zmienić i używać obu W współczesnych aplikacjach do notowania użytkownicy często muszą wybierać między dwiema różnymi filozofiami: wizualną prostotę edycji w **Rich Text** a przenośną prostotę **Markdowna**. Większość aplikacji zmusza do wyboru jednego z nich. **NoteRich** rozwiązuje ten problem. Dzięki zaawansowanej architekturze dwóch trybów, NoteRich umożliwia bezproblemową zmianę między reprezentacjami Rich Text a Markdown tego samego treści, oferując najlepsze elementy obu światów bez kompromisów. --- ## Zrozumienie dwóch trybów Zanim przejdziemy do tego, jak zmieniać tryby, ważne jest, aby zrozumieć, co oferuje każdy tryb i kiedy go używać. ### Tryb Rich Text: Wizualna edycja na najwyższym poziomie Tryb Rich Text zapewnia doświadczenie edycji typu **WYSIWYG (What You See Is What You Get)**. Kiedy jesteś w trybie Rich Text: - **Formatowanie wizualne**: Kursywne, pogrubione, nagłówki i listy wyglądają dokładnie tak, jak będą wyglądać po renderowaniu - **Dostęp do narzędzi**: Rozwiązanie formatowania z narzędziami umożliwia jednokliknięcie dostępu do wszystkich opcji stylizacji - **Wstawienie mediów**: Obrazy, tabeli, równania i elementy interaktywne wyświetlają się wewnątrz tekstu - **Przesuwanie i kładzenie**: Łatwe reorganizowanie treści poprzez przesuwanie bloków - **Menu kontekstowe**: Działania kliknięcia prawą klawiszem i narzędzia formatowania unoszące się w powietrzu zwiększają produktywność Tryb Rich Text jest idealny dla: - Użytkowników, którzy preferują wizualne informacje podczas pisania - Dokumentów z złożonymi układami (tabeli, układy wielokolumnowe) - Sesji edycji współpracowniczych, gdzie wizualna jasność jest ważna - Szybkiego formatowania bez muszenia zapamiętywać składnię ### Tryb Markdown: Przenośna prostota Tryb Markdown reprezentuje twoje treści jako tekst prosty z lekką składnią. Kiedy pracujesz w trybie Markdown: - **Przenośność tekstu prostogłównego**: Twoje notatki są przechowywane w formatie uniwersalnie czytelnym - **Ścieżka pracy z klawiszami**: Formatowanie tekstu za pomocą prostych skrótów klawiszowych (`**bold**`, `*italic*`, `# Nagłówek`) - **Zgodny z kontrolą wersji**: Czyste różnice w Git i innych systemach kontroli wersji - **Szybkie pisanie**: Nie potrzebujesz myszy; trzymaj ręce na klawiaturze - **Uniwersalna kompatybilność**: Exportuj i udostępniaj pliki `.md`, które działają w każdym miejscu Tryb Markdown jest doskonały dla: - Dokumentacji technicznej i notatek bogatych w kod - Pisarzy, którzy preferują edycję tekstu prostogłównego bez rozpraszania uwagi - Tworzenia treści długich z minimalnym obciążeniem formatowania - Użytkowników, którzy chcą maksymalnej przenośności i przyszłościowości --- ## Architektura dwóch trybów NoteRich nie oferuje po prostu dwóch oddzielnych doświadczeń edycji – tworzy **zjednoczony model treści**, który może być reprezentowany w obu formatach natychmiastowo. Odbywa się to dzięki zaawansowanemu silnikowi transformacji, który konwertuje między wewnętrzną strukturą dokumentu a składnią Markdown w czasie rzeczywistym. ```mermaid graph TD A[Użytkownik wprowadza dane] --> B{Model dokumentu wewnętrzny} B --> C[Reprezentacja Rich Text] B --> D[Reprezentacja Markdown] C --> E[Działania narzędzi wizualnych] C --> F[Operacje przesuwania i kładzenia] C --> G[Formatowanie menu kontekstowe] D --> H[Wykrywanie skrótów Markdown] D --> I[Rozpoznawanie wzorców składniowych] D --> J[Import/export tekstu prostogłównego] B --> K[Liczyna przechowywania] K --> L[Przechowywanie w IndexedDB] K --> M[P2P Sync Payload] style A fill:#fafafa,stroke:#eaeaea,color:#333 style B fill:#000,stroke:#000,color:#fff style C fill:#fafafa,stroke:#eaeaea,color:#333 style D fill:#fafafa,stroke:#eaeaea,color:#333 style K fill:#000,stroke:#000,color:#fff ``` Ta architektura oznacza, że **twoje treści nigdy nie zostają zamknięte w jednym formatie**. Niezależnie od tego, czy zaczynasz pisać w Markdown, czy stosujesz formatowanie za pomocą narzędzi w Rich Text, podstawowa struktura dokumentu pozostaje niezmieniona, umożliwiając natychmiastową zmianę bez utraty danych czy uszkodzenia formatu. --- ## Jak zmieniać tryby ### Metoda 1: Wybór trybu na podstawie ustawień NoteRich oferuje globalne ustawienie, które określa domyślny tryb edycji dla wszystkich notatek: 1. **Otwórz Ustawienia**: Kliknij ikonę skrzynek (⚙️) w górnej prawym rogu edytora 2. **Znajdź przełącznik „Rich Text”**: Znajdź przełącznik oznaczony jako „Rich Text” w panelu ustawień 3. **Przełącz tryb**: - **Włączony (✓)**: Edytor otwiera się w trybie Rich Text z pełnymi narzędziami - **Wyłączony (○)**: Edytor otwiera się w trybie tekstu prostogłównego/Markdown ```mermaid sequenceDiagram participant Użytkownik participant Panel ustawień participant Edytor participant Model dokumentu Użytkownik->>Panel ustawień: Kliknij ikonę ustawień Użytkownik->>Panel ustawień: Przełącz przełącznik „Rich Text” Panel ustawień->>Edytor: Zaktualizuj flagę isRichText Edytor->>Model dokumentu: Przekształć z nowym trybem Edytor-->>Użytkownik: Wyświetl uaktualnioną interfejsem ``` **Ważne**: Zmiana tego ustawienia wymaga ponownego otwarcia strony, aby zadziałało. Zapewnia to, że wszystkie dodatki i komponenty narzędziowe są odpowiednio inicjowane dla wybranego trybu. ### Metoda 2: Import/Export notatek jako Markdown Nawet pracując głównie w trybie Rich Text, możesz importować i eksportować pojedyncze notatki jako Markdown: #### Eksportowanie notatki do Markdown 1. Otwórz notatkę, którą chcesz eksportować 2. Kliknij **Menu działań** (zazwyczaj reprezentowany przez trzy kropki `⋮` lub ikonę pobrania) 3. Wybierz **„Eksportować jako Markdown”** 4. Notatka zostaje przekształcona na składnię Markdown i zapisana jako plik `.md` Proces eksportu inteligentnie obsługuje: - **Nagłówki**: Przekształcane na składnię `#`, `##`, `###` - **Listy**: Listy z tabulacjami i numerowanymi zachowane z odpowiednim odstępami - **Bloki kodu**: Anotacje językowe zachowane (np., ```javascript) - **Tabeli**: Formatowane jako tabelki Markdown z oznaczeniami porządkowymi - **Linki i obrazy**: URLy zachowane z tekstem alternatywnym #### Importowanie treści Markdown 1. Stworz nową notatkę lub otwórz istniejący szkic 2. Uzyskaj dostęp do funkcji **Import** z menu działań 3. Wybierz plik `.md` lub wklej tekst Markdown bezpośrednio 4. NoteRich automatycznie wykrywa składnię Markdown i przekształca ją na wewnętrzną strukturę dokumentu Silnik importu wykorzystuje rozpoznanie wzorców, aby zidentyfikować elementy Markdown: ```markdown Pattern → Element Rich Text -------------------------------------------------- # Nagłówek 1 → H1 Nagłówek ## Nagłówek 2 → H2 Nagłówek **tekst pogrubiony** → Element tekstu pogrubiony *tekst kursowany* → Element tekstu kursowany - Element listy → Element listy z tabulacją 1. Element numerowany → Element listy numerowany > Element cytatu → Element cytatu ```code``` → Element bloku kodu [Link](url) → Element linku ![Obraz](url) → Element obrazka ``` ### Metoda 3: Skróty Markdown w trybie Rich Text Jedną z najpotężniejszych funkcji NoteRich jest możliwość używania **skrótów Markdown nawet w trybie Rich Text**. Ta hybrydowa metoda pozwala ci pisać naturalnie, wykorzystując szybkość Markdown. Gdy tryb Rich Text jest włączony, wpisywanie składni Markdown wywołuje automatyczną konwersję: | Wpisz to | Stanie się to | Warunek wywołania | |-----------------|-------------------|----------------------| | `# ` | H1 Nagłówek | Przerwa po znaku # | | `## ` | H2 Nagłówek | Przerwa po dwóch znaków # | | `### ` | H3 Nagłówek | Przerwa po trzech znaków # | | `- ` lub `* ` | Lista z tabulacją | Przerwa po znaku -/asteriske | | `1. ` | Lista numerowana | Przerwa po numerze i znaku | | `[] ` | Lista z kategoriami | Przerwa po nawiasach | | `> ` | Element cytatu | Przerwa po znaku większego | | ```` ``` ```` | Blok kodu | Trzy znaki i Enter | | `**tekst**` | **Tekst pogrubiony**| Ostatnie znaki gwiazdki | | `*tekst*` | *Tekst kursowany* | Ostatnie znaki gwiazdki | | `~~tekst~~` | ~~Tekst przecięty~~| Ostatnie znaki tildy | | `` `tekst`` | `Tekst wielokropkowy`| Ostatnie znaki wcięcia | | `[tekst](url)` | [Hyperlink](url) | Pełna składnia linku | | `---` lub `***` | Linia pozioma | Trzy znaki i kropka | ```mermaid graph LR A[Użytkownik wprowadza Markdown] --> B{Detektor skrótów] B -->|Wzorzec odpowiada| C[Przekształć w element] B -->|Nie odpowiada| D[Zachowaj jako tekst prostogłówny] C --> E[Zaktualizuj stan edytora] E --> F[Renderować Rich Text] style A fill:#fafafa,stroke:#eaeaea,color:#333 style B fill:#000,stroke:#000,color:#fff style C fill:#fafafa,stroke:#eaeaea,color:#333 style F fill:#fafafa,stroke:#eaeaea,color:#333 ``` To oznacza, że możesz cieszyć się **szybkością pisania w Markdown** z **wizualnymi zaletami renderowania Rich Text** – wszystko bez konieczności manualnego zmiany trybów. --- ## Funkcje zaawansowane: Elementy wieloliniowe Silnik Markdown NoteRich zawiera zaawansowane funkcje obsługi elementów wieloliniowych, szczególnie bloków kodu i cytatów z nagłówkami. ### Wykrywanie bloków kodu Edytor inteligentnie rozróżnia bloki kodu jednoliniowe od wieloliniowych: ```markdown Jednoliniowy: ```python print("Hello")``` → Obróbka kodu w linii Wieloliniowy: ```python def hello(): print("Hello") ``` → Pełny blok kodu Kiedy importujesz lub wpisujesz bloki kodu, NoteRich: 1. Wykrywa znak otwierający (``` + opcjonalny identyfikator języka) 2. Wchłania cały tekst do momentu znaku zamknięcia 3. Zachowuje odstępy i białka tak, jak zostały wpisane 4. Stosuje podświetlanie składni zgodnie z identyfikatorem języka ### Obsługa list złożonych poziomów odstępów Listy z wieloma poziomami odstępów są odpowiednio przywrócone: ```markdown - Element poziomu 1 - Element poziomu 2 (4 spacery odstępów) - Element poziomu 3 (8 spacery odstępów) - Powrót do poziomu 1 ``` Silnik konwersji oblicza poziomy odstępów i tworzy odpowiednią strukturę list złożonych w modelu dokumentu. --- ## Względy dotyczące wydajności Konwersja dwukierunkowa między Rich Text a Markdown jest optymalizowana pod względem wydajności, nawet przy dużych dokumentach. ### Wymiary konwersji ```echarts { "xAxis": { "type": "category", "data": ["1k chars", "5k chars", "10k chars", "25k chars", "50k chars"], "axisLabel": { "color": "#666" } }, "yAxis": { "type": "value", "name": "Time (ms)", "splitLine": { "lineStyle": { "color": "#f4f4f5" } }, "axisLabel": { "color": "#666" } }, "series": [ { "name": "Markdown → Rich Text", "data": [8, 15, 22, 35, 48], "type": "line", "smooth": true, "lineStyle": { "color": "#000", "width": 3 }, "itemStyle": { "color": "#000" }, "symbol": "circle", "symbolSize": 8 }, { "name": "Rich Text → Markdown", "data": [5, 10, 16, 28, 38], "type": "line", "smooth": true, "lineStyle": { "color": "#666", "width": 2, "type": "dashed" }, "itemStyle": { "color": "#666" }, "symbol": "circle", "symbolSize": 8 } ], "grid": { "left": "10%", "right": "5%", "bottom": "10%" }, "legend": { "data": ["Markdown → Rich Text", "Rich Text → Markdown"], "bottom": 0, "textStyle": { "color": "#666" } } } ``` Nawet przy dokumentach przekraczających 50 000 znaków, konwersja zakończa się w mniej niż 50 milisekund – niezauważalna dla użytkowników podczas normalnego działania. ### Aktualizacje zestawowe Zamiast ponownie analizować cały dokument przy każdym kliknięciu, NoteRich używa **transformacji zestawowego**: - **Skróty Markdown**: Tylko aktualna linia jest analizowana pod względem wzorów - **Działania narzędzi wizualnych**: Bezpośrednia manipulacja elementami bez całkowitego ponownego serializowania - **Importy zestawowe**: Duże pliki Markdown są przetwarzane pojedynczo, aby uniknąć blokowania interfejsu --- ## Best practices dotyczące wyboru trybu ### Kiedy używać trybu Rich Text Wybierz tryb Rich Text jako domyślny, gdy: 1. **Ważny jest wizualny układ**: Tworzenie dokumentów z tabelami, obrazami i złożonymi formatami 2. **Praca współpracowniczna**: Udzielanie notatek członkom zespołu, którzy preferują edycję wizualną 3. **Częste zmiany formatowania**: Używanie narzędzi wizualnych do szybkich ajustamentów stylistycznych 4. **Odbiorcy nietechniczni**: Przygotowywanie treści dla czytelników nieznających składni Markdown 5. **Potrzeby dostępności**: Wykorzystanie czytników ekranowych, które lepiej obsługują strukturę rich text ### Kiedy używać trybu Markdown Wybierz tryb Markdown (lub tekst prostogłówny), gdy: 1. **Dokumentacja bogata w kod**: Pisanie przewodników technicznych z licznymi przykładami kodu 2. **Integracja z kontrolą wersji**: Śledzenie zmian w repozytoriach Git 3. **Pisanie bez rozpraszania uwagi**: Preferujesz minimalistyczne interfejsy bez narzędzi wizualnych 4. **Przepływ pracy cross-platformowy**: Częste eksportowanie do innych narzędzi kompatybilnych z Markdown 5. **Ścieżka pracy skupiona na klawiszach**: Chcesz mieć ręce na klawiaturze przez cały czas ### Metoda hybrydowa: Strategia użytkownika zaawansowanego Wielu doświadczonych użytkowników NoteRich przyjmuje **hybrydową ścieżkę pracy**: 1. **Ustaw jako domyślny Rich Text**: Ciesz się pełnymi narzędziami wizualnymi i informacjami 2. **Używaj skrótów Markdown**: Pisz `#`, `-`, `**tekst**` dla szybkiego formatowania 3. **Eksportuj jako Markdown**: Udostępniaj przewijane wersje, gdy to konieczne 4. **Importuj pliki Markdown**: Przynieś zewnętrzną treść bez problemu Ta metoda maksymalizuje zarówno **szybkość pisania**, jak i **wizualną jasność**, wykorzystując zalety obu trybów. --- ## Rozwiązywanie popularnych problemów ### Problem: Skróty Markdown nie wywołują żadnych działań **Objawy**: Wpisywanie `#` lub `-` nie przekształcają się w nagłówki lub listy **Rozwiązania**: 1. Upewnij się, że tryb Rich Text jest włączony (sprawdź panel ustawień) 2. Upewnij się, że plugin skrótów Markdown jest aktywny 3. Sprawdź, czy nie są współdziałające pliki zastosowania 4. Spróbuj dodać spację po symbolu Markdown ### Problem: Utracone formatowanie podczas eksportu **Objawy**: Eksportowany plik Markdown brakuje niektórych elementów formatowania **Rozwiązania**: 1. Niektóre zaawansowane funkcje (kolorowe, elementy wstawione) mogą nie mieć odpowiedników w Markdown 2. Sprawdź eksportowany plik na obecność niezrozumiałych elementów 3. Używaj eksportu HTML dla złożonych dokumentów z wybranym formatowaniem ### Problem: Import tworzy nieoczekiwany układ **Objawy**: Importowany Markdown nie odpowiada oczekiwanym układowi **Rozwiązania**: 1. Sprawdź, czy składnia Markdown odpowiada specyfikacji CommonMark 2. Sprawdź, czy listy mają niejednolite odstępy 3. Upewnij się, że znak otwierający bloków kodu jest prawidłowo zamknięty 4. Przetestuj małe sekcje, aby wyeliminować problemy z składnią ### Problem: Wydajność z dużymi dokumentami **Objawy**: Opóźnienia podczas pisania lub zmiany trybu w bardzo długich notatkach **Rozwiązania**: 1. Włącz transformację zestawową w ustawieniach 2. Rozdziel bardzo długie dokumenty na podnotatki łączące się ze sobą 3. Wyłącz niepotrzebne dodatki w trybie tekstu prostogłównego 4. Używaj trybu Markdown do początkowej redagacji, przejdź do Rich Text dla finalnego formatowania --- ## Przyszłość edycji dwóch trybów Architektura dwóch trybów NoteRich stanowi fundamentalną zmianę w sposobie myślenia o edycji dokumentów. Zamiast traktować Rich Text i Markdown jako konkurencyjne formaty, NoteRich łączy je w **jednolitą, elastyczną strukturę treści**, która dostosowuje się do twojej ścieżki pracy. Przewidywane ulepszenia obejmują: - **Ustawienia trybu dla pojedynczych notatek**: Przełączanie domyślnych ustawień dla pojedynczych notatek - **Kooperacja w czasie rzeczywistym**: Widok natychmiastowego wyświetlania skrótów Markdown przez współpracowników - **Konwersja za pomocą AI**: Smarty sugestie dla optymalizacji wyboru formatu - **Kosztowni konwertoryzy**: Definiowanie własnych map Markdown do Rich Text --- ## Wniosek Wybór między Rich Text a Markdown nie powinien być propozycją jedno lub drugie. Dzięki innowacyjnej architekturze dwóch trybów NoteRich uzyskujesz: ✅ **Wizualną bogactwo** w momencie potrzeby ✅ **Prostotę tekstu prostogłównego** wtedy, gdy tego potrzebujesz ✅ **Bezproblemową zmianę** między nimi ✅ **Skróty Markdown** w trybie Rich Text ✅ **Pełną kompatybilność** z zewnętrznymi narzędziami Markdown Niezależnie od tego, czy jesteś programistą edytującym kod, pisarzem tworzącym treści długie, czy pracownikiem zarządzającym złożonymi projektami, NoteRich dostosowuje się do twojej preferowanej ścieżki pracy – bez konieczności kompromisów. Zacznij od trybu, który wydaje ci się najbardziej naturalny, eksperymentuj z skrótami Markdown i znajdź idealny balans dla swoich specjalnych potrzeb. Twoje notatki, na twoją sposobność. --- ## Divizm: Flexibilność i prostota <div class="flex flex-wrap gap-2 mt-8 mb-12"> <span class="px-3 py-1 bg-[#f4f4f5] border border-[#eaeaea] rounded-full text-xs font-medium text-[#666]">Rich Text</span> <span class="px-3 py-1 bg-[#f4f4f5] border border-[#eaeaea] rounded-full text-xs font-medium text-[#666]">Markdown</span> <span class="px-3 py-1 bg-[#f4f4f5] border border-[#eaeaea] rounded-full text-xs font-medium text-[#666]">Dwójny tryb</span> <span class="px-3 py-1 bg-[#f4f4f5] border border-[#eaeaea] rounded-full text-xs font-medium text-[#666]">WYSIWYG</span> <span class="px-3 py-1 bg-[#f4f4f5] border border-[#eaeaea] rounded-full text-xs font-medium text-[#666]">Skróty</span> <span class="px-3 py-1 bg-[#f4f4f5] border border-[#eaeaea] rounded-full text-xs font-medium text-[#666]">Produktywność</span> </div>