Home / JavaScript / Miscellaneous

WebDen.dev is an open source mobile and tablet friendly alternative to JSFiddle and JSBin.

WebDen.dev is an open source mobile and tablet friendly alternative to JSFiddle and JSBin. It is a fully client-side app so you can install it as a progressive web app (PWA) on your device to use offline.
Information
Category: JavaScript / Miscellaneous
Watchers: 1
Star: 23
Fork: 1
Last update: Sep 1, 2021
Resource links
https://webden.dev
https://github.com/chrisdiana/webden

WebDen

WebDen.dev is an open source mobile and tablet friendly alternative to JSFiddle and JSBin. It is a fully client-side app so you can install it as a progressive web app (PWA) on your device to use offline.

WebDen Screenshot

Features

  • HTML, CSS & JS editors
  • JavaScript console emulation
  • Preview panel
  • Designed first for mobile and tablet use
  • Import and export projects
  • Save code as HTML
  • Light & dark themes
  • Keyboard shortcuts
  • Offline support

Why?

The landscape of online editors aren't currently optimized for mobile or tablet. The iOS apps in this space have improved but were limited when this project originally started.

How to install

iOS Safari

Go to Share Menu > Add to Home Screen

Chrome

Go to Settings > Add to Home Screen

How to use libraries or frameworks

Add any scripts to the HTML tab as you would in a HTML file.

Coming Soon

  • Save as Github Gist
  • Pushing / Pulling repos from Github
  • Updated console features
  • Updated editor theme features
  • Capture JavaScript errors (for console)

Thanks!

1 Open More issues
Closed

Add Dockerfile and compose file to build WebDen as a Docker container

Created 2 Docker files and instructions that lets you run WebDen in a Docker container

opened Aug 31, 2021 by SegiH 2
Closed

Run JavaScript on initial load

JavaScript doesn't run when initially loaded. Trigger when starting the application and wrap in a IFFE

bug 
opened Sep 27, 2021 by chrisdiana 1
Closed

Editor ruler setting not saving

When unselecting the “Ruler” setting in the editor option menu, the settings aren’t saved on reopen.

good first issue 
opened Sep 3, 2021 by chrisdiana 1
Closed

I have code on the js tab, how do I execute it?

My code is very similar to the screenshot in the readme. How do I execute it to so that the results appear on the console tab?

edit: nevermind.

opened Sep 9, 2021 by ogrotten 0
Open

How to not auto run script?

I wrote a massive of code which takes much time to run. I don't want it to run every time I edited the code but only when I go to the preview tab or the console. What can I do?

opened Oct 4, 2021 by 14725 1
Open

Better asset handling

Add functionality to allow to more easily add static assets such as images, CSS, and JavaScript files.

enhancement 
opened Sep 27, 2021 by chrisdiana 0
Open

Add export all settings and projects

WebDen only allows for exporting individual projects currently. The app should have the ability to export all projects and settings and be able to import them later if needed.

enhancement 
opened Sep 27, 2021 by chrisdiana 0

Contents

    wkei An offline desktop app likes JSFiddle/CodePen/JSBin powered by Vue + Electron
    H-M-H Use your tablet as graphic tablet/touch screen on your computer.
    ERESB0S Son zamanlarda yaygınlaşan ve yapmayı bilmeyenler için hazırlayıp paylaştım. Umarım kullanıp "ben yaptım" diye dolaşmazsınız tşk. :)
    egoist Like codepen and jsbin but works offline.
    egoist JavaScript debugging made simple.
    matomo-org The Universal Device Detection library will parse any User Agent and detect the browser, operating system, device used (desktop, tablet, mobile, tv, cars, console, etc.), brand and model.
    matomo-org The Universal Device Detection library will parse any User Agent and detect the browser, operating system, device used (desktop, tablet, mobile, tv, cars, console, etc.), brand and model.
    LUSHDigital LUSH Player for Mobile, Tablet & TV
    amirk3321 flutter Booking Management Dashboard responsive (web,mobile,tablet)
    englishextra QR code generating with vanilla js (SVG Element, Data URI SVG String, Data URI PNG String, HTML Table Element).
    sindresorhus Cross-platform `/dev/null`
    plausible Plausible Analytics is a simple, lightweight (< 1 KB), open-source and privacy-friendly alternative to Google Analytics
    djyde Cusdis - Open source, lightweight (~5kb gzip), privacy-friendly alternative to Disqus.
    funkey Pen event interception for line smoothing on the reMarkable 2 tablet
    avargas05 GUI for calibrating the wacom tablet to a screen or window
    bordaigorl The reMy app for the reMarkable tablet
    RedTeamPentesting A document encryption solution for the reMarkable 2 ePaper tablet.
    fharper A curated list of projects, templates or anything interesting related to the Supernote tablet
    pd4d10 Show uncaught errors friendly in Node.js.
    SnaKKo Fossdroid Core is a web frontend of F-Droid: an alternative software repository comprising only free, open source software for Android. This repo is the open source version of fossdroid.com.
    lexiconhq Lexicon is a customizable, open source mobile app that provides an elegant mobile discussions experience
    Share this repo

    Related Repos


    Miscellaneous
    5.5k
    Apache OpenWhisk is an open source serverless cloud platform
    apache OpenWhisk OpenWhisk is a serverless functions platform for building cloud applications. OpenWhisk offers a rich programming model for creating serverl
     
    Miscellaneous
    11
    Replaces twitter NFT idiocracy
    4ndv HexaGone HexaGone allows you to revert or customize twitter's new hexagonal avatars. It's a collection of a several userscripts, with different clip m
     
    Miscellaneous
    6
    replaces the nft avatars on twitter with subway jared
    virginteen replace-nft-avatars a chrome extension that replaces the nft avatars on twitter with subway jared to install Download this repo (Code > Download ZIP).
     
    Miscellaneous
    5
    Smart Contract Viewer for VS Code
    MetaplasiaTeam Contract Viewer English | 中文 Contract Viewer 是一个 VS Code 扩展，他可以帮你从区块链浏览器下载合约代码，只需要一个合约地址即可下载。 目前仅支持以太坊使用 Solidity 的智能合约，后续会支持更多类型。 快速开始 配置一个 API 在 Erh
     
    Miscellaneous
    5
    Video calling using WebRTC
    mehditeymorian webrtc-video-call This project is a video calling application using WebRTC technology. It contains minimum requirements to provide a group video call.
     
    Miscellaneous
    3
    A multipurpose bot, a clan bot, a all in one bot. The one bot u need for ur server origina...
    Tomato6966 Multipurpose-discord-bot A multipurpose bot, a clan bot, a all in one bot. The one bot u need for ur server originally made as Milrato discord Bot and
     
    Miscellaneous
    334
    A template for site builders and low-code tools.
    vercel Platforms Starter Kit The all-in-one starter kit for building platforms on Vercel. Introduction · Guide · Demo · Contributing Deploy Your Own Read the
     
    Miscellaneous
    152
    A Raycast/Alfred/Spotlight alternative
    ospfranco sol A Raycast/Alfred/Spotlight alternative Don't bother trying to run this, it's WIP, right now only the basic UI is there, no logic, there many bugs/
     
    Miscellaneous
    73
    Self hosted media tracker for movies, tv shows, video games, books and audiobooks
    bonukai MediaTracker · Self hosted platform for tracking movies, tv shows, video games, books and audiobooks, highly inspired by flox Demo https://mediatracke
     
    Miscellaneous
    52
    Everytime I come across good Github profiles I index them here
    championswimmer awesome-devs Everytime I come across good Github profiles I index them here NOTE: If you are on the github repo currently, go to the website 👇 to see
     
    Miscellaneous
    49
    Minimalist template for foundry projects
    ZeframLou Foundry template This is a template for a Foundry project. Installation To install with DappTools: dapp install [user]/[repo] To install with Foundry
     
    Miscellaneous
    45
    Log in the node terminal from the browser
    patak-dev vite-plugin-terminal Log in the node terminal from the browser Open a playground online in StackBlitz Install npm i -D vite-plugin-terminal Add plugin
     
    Miscellaneous
    43
    A simple web3 app for minting NFTs
    fireship-io Web3 - Full Tutorial The demo contains a basic web3 app and smart contract for minting NFTs. See it in action in the Web3 NFT Tutorial on YouTube. Fol
     
    Miscellaneous
    28
    A three.js component library for Svelte.
    grischaerbe A three.js component library for svelte. Index What is threlte? Getting started Concepts Interactivity Viewport Awareness Reactivity Conventions Refer
     
    Miscellaneous
    26
    Wordle Svelte Clone
    tayfunerbilen Wordle Svelte Clone Son zamanlarda popüler olan WORDLE uygulamasını svelte ile yapmaya çalıştım. Bu tarz acaba yapsam nasıl yapardım uygulamarı bana ç