codeswing VS excalidraw

I think I found my solution - looks like the codeswing extension (https://aka.ms/codeswing) supports live preview, even in vscode.dev. Awesome!

Many of these features are also available in the other platforms and I really like that you can immediately see the results of your projects as you code them. But this feels like a great end-to-end solution requiring only one login I need for most of my work anyways. Incidently, if you want the immediate display of your project inside VS Code in the browser, you can also install the Codeswing extension.

Codeswing is an awesome tool made to prototype easily from vscode using any frontend you want (you can already have Svelte, React, Vue or Html/CSS/Js), with an auto-refresh rendering preview.

Coding playgrounds (e.g. CodePen, JSFiddle) are a popular way to learn programming languages/libraries, and then share them with others. With github.dev, you can install the CodeSwing extension and begin creating web playgrounds, using your existing editor setup, and with your files persisted back to GitHub.

VS Code with Codewsing: https://github.com/codespaces-contrib/codeswing

Hey! By default, none of the current templates add any libraries to the swing. However, I'm planning on adding new template galleries to make it easy to create/explore ideas using popular frameworks. I'd love to hear if you have any suggestions for what you'd like to see me prioritize (e.g. React, Tailwind, etc.), since I'll be working on that this weekend :D

That said, when you create/open a swing, there will be a "CodeSwing" view on the Explorer tab, which displays all the files in the swing. One of those files will be called "codeswing.json", which is the manifest for the swing itself. If you click on it, you'll see two array properties, called "scripts" and "styles", which list the libraries that have been added to the swing. When you add a new library via the "Add Library" command, it will add the selected library to that file: https://github.com/codespaces-contrib/codeswing#external-lib.... Let me know if you have any feedback on that experience!

Regarding sharing: I also maintain another VS Code extension called GistPad (https://aka.ms/gistpad) that allows you to login to GitHub and then manage gists/repos without cloning/committing files. I'm finalizing the integration between CodeSwing and GistPad that will allow you to create swings as gists, and then share the URL with others. Since GistPad shows your starred gists, and lets you follow other GitHub users, you can also share swings by simply starring/following others that are creating swings in gists.

Additionally, since you can create new swings as local directories (using the "CodeSwing: New Swing..." command), you could store a swing in a GitHub/BB/GitLab repo, and then when others clone and open that repo in VS Code, the CodeSwing extension will detect the swing and automatically launch the right coding environment. The gif in the project's README shows that in action, using GitHub Codespaces.

Let me know if any of that sounds interesting, or if you have feedback on how I could improve the overall experience. Thanks so much for checking out CodeSwing!

ExcaliDraw - https://excalidraw.com/

ExcaliDraw

However, Notion and Obsidian can only help you write documentation. Well, how about some visuals? Let's talk about Excalidraw.

Fun fact: I used GA in Excalidraw, and it's still powering some of the interactions! https://github.com/excalidraw/excalidraw/blob/master/package...

I was happy to find out recently that there is a way to make Mermaid diagrams WYSIWYG / drag and drop editable that the open source https://excalidraw.com has and did I mention it's open source!? With a LLM, you can go full loop back to Mermaid again after a few rounds of manual editing. "What a time to be alive!"

I'm working on a personal project and found myself looking for an alternative to Postman/Insomnia this morning. This made me realize i've been using the same tools for so long for work (mobile development, finance) that this project may be a good time to try out some new things.

Here are a few tools that i've been using lately that I really enjoy:

https://pocketbase.io/ - A dead-simple self-hosted firebase/supabase-like "backend in a box" using golang and sqlite. So far i've been really impressed. I've gone the route of extending the base offering with more go code and am really enjoying the experience.

https://excalidraw.com/ - An open source whiteboarding tool. Slick to use and after learning some keybinds I've gotten pretty fast at throwing together diagrams to explain things to people on my team. The killer piece though is that the filetype is just json, so I can source control my diagrams. Even better, their "export to png" function has a box to embed the json data _into_ the png, allowing me to slap the diagram in places that only accept images (think confluence) and still be able to change the diagram later if needed. 10/10.

https://docs.gitlab.com/ee/ci/ - Gitlab's CI/CD toolset is really impressive, and I've gotten really intimate with it's deeper features over the past year. I'd be curious though to hear from someone who's familiar with it vs it's competitors.

Sketch easy and go back to work...

https://excalidraw.com/