This is Day 3 of DEVember, where we'll be displaying rich text within our React Native app! In this tutorial, we're focusing on how to render Markdown content, the widely used .md format, within your React Native projects. Whether you're looking to display READMEs, user guides, or any Markdown-based content, by the end of this video, you'll have all the tools you need to integrate Markdown rendering seamlessly into your app!

🌟DEVember Day 3: www.notjust.dev/projects/devember/day3

If you have ideas of features, topics, or apps you would like me to cover during #DEVember, you can submit them on our 💡Idea Board:
github.com/notJust-dev/DEVember/discussions/catego…

📚 Today's Agenda:
Introduction to Markdown
Markdown Syntax Overview
Setting Up React Native for Markdown
Implementing Markdown Rendering
Styling Markdown Content
Using Markdown in React Native Components
Recap and Q&A Session

❗Try our FREE 4-day Masterclass on notJust.Academy:
assets.notjust.dev/masterclass/?utm_source=youtube…

📚 Enroll NOW in The Full-Stack Mobile Developer course and don’t miss out on your chance to become a 6-figure dev! Check out what our successful students are saying about their experience:
academy.notjust.dev/?utm_source=youtube&utm_medium…

💬 Join the notJust Development gang and let's build together:
Twitter: twitter.com/VadimNotJustDev
Instagram: www.instagram.com/VadimNotJustDev
Facebook: www.facebook.com/notjustdev
LinkedIn: www.linkedin.com/in/vadimsavin
Discord: discord.gg/VpURUN2

Timecodes:
0:00 Introduction to DEVember and Markdown in React Native
1:13 Use Cases for Markdown in Mobile Apps
1:59 Utilizing Markdown for Various App Content
2:32 Agenda: Markdown Introduction, Rendering, and Editor Building
3:09 DEVember Overview
4:32 Starting the React Native Markdown Tutorial
5:12 Recap of Previous DEVember Tutorials
5:47 Setting Up the Project for Day 3
6:20 Creating the Editor Screen for Markdown
7:00 Accessing GitHub Repository for Tutorial Projects
8:25 Implementing Markdown in the App
9:03 Installing Markdown Library in Expo
10:40 Handling Library Installation Issues
11:40 Importing Markdown and Initial Rendering
12:58 Troubleshooting and Adjusting Markdown Rendering
13:44 Styling the Markdown Page
14:40 Generating Sample Markdown Content
17:01 Inserting and Styling the Sample Content
17:46 Adjusting Styles for Better Readability
20:34 Customizing Heading Styles in Markdown
21:39 Further Styling Adjustments
22:49 Styling Body Text and Headers
24:57 Resolving Font Weight Issues with Custom Fonts
25:35 Implementing Scrollable Markdown Content
26:21 Adjusting Scroll View Settings for Notches
27:10 Finalizing Markdown Content Display
28:24 Adding Images and Links to Markdown
29:17 Handling Code Blocks and Inline Code
31:07 Exploring Markdown Plugins and Extensions
32:11 Creating a Reusable Markdown Display Component
34:47 Implementing Markdown Display in App
35:31 Passing Markdown Content as Props
36:14 Adding Description to App Pages with Markdown
37:01 Implementing an Editor for Markdown Content
39:03 Creating a State Variable for Markdown Content
40:11 Adding Editing Capabilities to Markdown Editor
41:49 Designing Tabs for Editing and Previewing Markdown
43:19 Styling the Text Input for Markdown Editing
44:24 Final Adjustments to Markdown Editor UI
45:34 Implementing State-Controlled Tab Switching
47:16 Adding Tabbed Navigation Between Editor and Preview
49:23 Styling Active Tab Indicator
51:06 Handling Tab Press Events
52:12 Finalizing Tab Functionality and Styling
54:24 Wrapping Up Markdown Editor and Renderer Tutorial
55:22 Conclusion and Outro

Disclaimer: This build is for educational purposes only. All views, opinions, and technology choices expressed in this video are my own and do not represent the views, opinions, or technology choices of any entity I have been, am now, or will be affiliated with.
#notjustdev #ReactNative #markdown