https://github.com/bonniesimon/preview-mark
Just a side project to write, render, preview and share Markdown🗒
https://github.com/bonniesimon/preview-mark
hacktoberfest marked-js reactjs tailwind-css typescript
Last synced: 4 days ago
JSON representation
Just a side project to write, render, preview and share Markdown🗒
- Host: GitHub
- URL: https://github.com/bonniesimon/preview-mark
- Owner: bonniesimon
- Created: 2021-06-28T06:43:06.000Z (almost 4 years ago)
- Default Branch: master
- Last Pushed: 2021-10-08T05:12:27.000Z (over 3 years ago)
- Last Synced: 2024-04-14T23:17:58.028Z (about 1 year ago)
- Topics: hacktoberfest, marked-js, reactjs, tailwind-css, typescript
- Language: TypeScript
- Homepage: https://tinyurl.com/previewmark
- Size: 2.54 MB
- Stars: 1
- Watchers: 2
- Forks: 2
- Open Issues: 3
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# Preview-mark
PreviewMark enables you to write, render, preview and share the markdown that you write.
**Work in progress 👷**## Learnings
- Configuring a React project using Typescript
- Using typescript for react
- Using TailwindCSS to create UI's.
- HTML converts multiple newline into a single whitespace. This doesn't allow use to use newline in textarea and use it for the preview since HTML converts the newlines into whitespace. [source](https://stackoverflow.com/questions/29574876/line-breaks-not-working-in-textarea-output)
- Adding custom renderer to *marked*. This was required since tailwind defaults all the heading tags. Used the [docs](https://marked.js.org/using_pro#use) of *marked*.
- Using localStorage to persist browser state
- Solved the gh-pages issue with react-router using [source](https://medium.com/@Dragonza/react-router-problem-with-gh-pages-c93a5e243819)
- Learned about the usecase of HashRouter. And the incompetence of react routing which creates confusion between server side and client side routing.## Tech Stack
**Client:** React+Typescript, TailwindCSS
**API:** Deta Micro
## Authors- [@bonniesimon](https://www.github.com/bonniesimon)