DEV Community

Cover image for 👩‍💻 Offline Codepen and JSFiddle
Shilpa for XenoX

Posted on • Edited on

28 14

👩‍💻 Offline Codepen and JSFiddle

Check this out. Web-Maker is an offline playground for testing and seeing the output of HTML, CSS and JavaScript code snippets. This is much faster compared to Codepen because it runs completely offline on your system.

GitHub logo chinchang / web-maker

A blazing fast & offline frontend playground

Web-Maker 🕸🛠


Web-Maker is an offline playground for your web experiments. Something like CodePen or JSFiddle, but much more faster and works offline because it runs completely on your system.

Open Web App (Recommended: More features. More fun!)

or

Screenshot

Features

  • Supports Preprocessors: HTML (Pug & Markdown), CSS (SCSS, LESS & Stylus, Atomic CSS) & JavaScript (ES6, TypeScript & CoffeeScript)
  • Works offline
  • Quick creation & good-old files mode
  • Inbuilt Console
  • Save and load your creations
  • Auto-save feature
  • Code auto-completion
  • Easy addition of popular JS & CSS libraries
  • Import & Export all creations anytime, anywhere
  • Multiple editor themes & other configurable settings
  • Font options + use any system font!
  • Very easily accessible. Simply open a new tab in Chrome! (in chrome extension only)
  • Multiple layouts to choose from
  • Capture preview screenshot (in Chrome extension only)
  • Save as HTML file
  • Edit in CodePen

Follow @webmakerApp for updates or tweet out…

Top comments (5)

Collapse
 
sarthology profile image
Sarthak Sharma

Damn, I always wanted to build one. Well, I can still contribute in it. Great find shilpa.

Collapse
 
shilpa3495 profile image
Shilpa

Thanks

Collapse
 
chinchang profile image
Kushagra Gour

Thanks for sharing here Shilpa! 🙏🏼

Collapse
 
shilpa3495 profile image
Shilpa

Collapse
 
equinusocio profile image
Mattia Astorino • Edited

No postcss support after 2 years old feature request 😔

Eliminate Context Switching and Maximize Productivity

Pieces.app

Pieces Copilot is your personalized workflow assistant, working alongside your favorite apps. Ask questions about entire repositories, generate contextualized code, save and reuse useful snippets, and streamline your development process.

Learn more

👋 Kindness is contagious

Please leave a ❤️ or a friendly comment on this post if you found it helpful!

Okay