My Journey in Web Development - Video & Photos
My Journey in Web Development - Video & Photos
Welcome to my multimedia blog post! Here I'll share my coding journey through videos, photos, and stories.
Featured Video: Building This Neon Blog
Watch how I built this amazing neon-themed blog from scratch:
Note: Replace the YouTube URL above with your actual video
My Coding Setup Photos
Here are some photos of my development environment:
My Workspace
My minimalist coding setup with dual monitors and neon lighting
Project Screenshots
Homepage with neon effects
Individual blog post layout
Tutorial: Adding Images to Your Blog
Here's a quick tutorial on how to add images to your markdown posts:
Method 1: External Images

Method 2: Local Images
- Create a
public/imagesfolder in your Next.js project - Add your images there
- Reference them like this:

Method 3: Styled Images
<img src="/images/your-image.jpg"
alt="Description"
style="width: 100%; max-width: 600px; border-radius: 8px;" />
Video Embedding Guide
YouTube Videos
To embed YouTube videos, use this responsive iframe code:
<div style="position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden;">
<iframe
src="https://www.youtube.com/embed/VIDEO_ID"
style="position: absolute; top: 0; left: 0; width: 100%; height: 100%;"
allowfullscreen>
</iframe>
</div>
Vimeo Videos
<div style="position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden;">
<iframe
src="https://player.vimeo.com/video/VIDEO_ID"
style="position: absolute; top: 0; left: 0; width: 100%; height: 100%;"
allowfullscreen>
</iframe>
</div>
Photo Gallery
Create beautiful photo galleries using CSS Grid:
Behind the Scenes Video
Here's another video showing the development process:
Tips for Multimedia Blog Posts
- Optimize Images: Use appropriate file sizes and formats
- Responsive Design: Ensure videos and images work on mobile
- Alt Text: Always provide descriptive alt text for accessibility
- Loading Performance: Consider lazy loading for large images
- Copyright: Only use images and videos you have rights to use
Conclusion
Multimedia content makes blog posts more engaging and interactive. With the right combination of text, images, and videos, you can create compelling stories that resonate with your audience.
Pro Tip: Replace the placeholder images and YouTube URLs with your actual content!
Happy blogging! πΈπ₯β¨