9 ms·
Gimli – A Visual Studio Code extension for front-end developers
- gimliapp 8y agoHi!, creator of Gimli here. i'll be happy to answer any questions you may have
- tuckerwales 8y agoI'm just wondering why you've posted before release? I was really excited to try it out, only to discover that it isn't released yet... :(
- gimliapp 8y agoAw, well i'm glad you wanted to try it :) Too answer your question though. I've been working on Gimli for the last 18 months now. Using up my own savings, and the reality is that I can't afford to keep working on it for much longer. I would have loved to be able to present a finished and polished product but i'm just not there yet.
- manigandham 8y agoI recommend releasing what you have now since you're about to get a lot of HN traffic. Use it for feedback and upsells while you have the chance.
- rattray 8y ago+1, release it as beta. We know how to deal with broken software, everyone here makes it all the time :-) (At least, I do)
- d3sandoval 8y agoWould love a way to sign up on a mailing list so I can get updates on when this will be released. Looks awesome and can't wait to try it!
- sucrose 8y agoOkay, you've dedicated time to your project... but you haven't answered the question: why you've posted before release?
- sfotm 8y agoI think it's to garner support for the kickstarter linked on the page.
- pvg 8y agoYou can't use Show HN for that, though. Take a look at https://news.ycombinator.com/showhn.html https://news.ycombinator.com/showhn.html
- oschn 8y agoHow do you map the rendered dom elements to the php source files?
- finchisko 8y agoHow much will it costs?
- gimliapp 8y agoThe current pricing is available at: https://www.kickstarter.com/projects/182057119/gimli https://www.kickstarter.com/projects/182057119/gimli Its basically: 29$ for a 2 year license. 35$ for a 2 year license + beta access
- manigandham 8y agoAt least double those prices if this tool does what it looks like. Actually triple them and add a real buy button to see sell through.
- brmgb 8y agoYou should also ask for an email to send a free trial/inform people of the release in order to build a first prospect list.
- mritchie712 8y agoI'd agree with this if it was ready now. I think a huge discount is warranted considering it's not actually available now and you're backing a Kickstarter.
- MVorlm 8y agoAgreed. If this actually has the polish + features it promises then it's worth _far_ more than what's quoted on the KS page. $80-100 dollars minimum.
- 0xfeba 8y agoSuper minor... but when I start scrolling down on FF 66.0.1 the "Debug" and the URL in what I thought was a bg image get garbled/overlapped: https://imgur.com/qLhgM8u https://imgur.com/qLhgM8u
- nkg 8y agoOne little thing: after watching the demo vid, Youtube suggest some related content. You can disable that. (I caught myself youtubing inside your landing page :D )
- ThorinJacobs 8y agoThis looks really cool and definitely fills a need I've had when doing web front-end. Does the UI viewer work with dynamic content such as that loaded from a back-end (or say, from a sample .json file in the event that we want to skip the API call)? I've done a lot of work in WPF/MVVM applications where everything ends up becoming a ResourceDictionary and breaks the Visual Studio UI viewer, so I'm curious how you handle it. Also, do you have any plans to incorporate a compatibility view? It would be really cool if I could select an item from a combo box and see what my UI would look like in (say) IE or Opera
- mig4ng 8y agoI recommend that you make the app available for beta testing with some users. Maybe even releasing a beta version to the public, do not make the mistake of waiting until you have the perfect product. Other request/suggestion is to make it open source or at least free for personal use, it will bring a lot of users that will want to have the same tooling at their workplaces. Then you can have commercial licenses that you make corporations pay for. Keep the great work!
- mft_ 8y agoAgree - could you release an Alpha version via Kickstarter? I'd pay (say) 50 SEK for alpha access to play with it for a couple of months, and (if wanted) give feedback on bugs. You could always end alpha access at a given point (set date or once the beta release is out) and/or offer upgrades to the full package at a slight discount. No downside, apart from a little more complication for you, and you'd maybe get a bit of money even sooner...
- turowicz 8y agoHow does this tie to working with Bootstrap-based custom css frameworks?
- firemelt 8y agosince its based on free and open source editor did it have a chance for a free version?
- johnx123-up 8y agoHow is it better than Pingendo?
- scarface74 8y agoI don’t do much front end work these days and won’t be for awhile, but this looks exciting. Hopefully, you can find a way to monetize it. If it ends up being usable, even as a beta, I will be donating.
- tatersolid 8y agoYou might want to consider a name change. Gimli has already been used for a cryptographic algorithm from a pretty famous team of cryptographers[1], so your SEO might take a hit by using that name. [1]: https://gimli.cr.yp.to/ https://gimli.cr.yp.to/
- littlestymaar 8y agoIt's also the name of a DWARF parser[1] which makes the best use of the name imho ;). This project is cool though! [1] https://github.com/gimli-rs/gimli https://github.com/gimli-rs/gimli
- maxencecornet 8y agoNot only, I know more than 3 completely unrelated piece of software using the name gimli:
- die_fault_user 8y agoHow about WeamDreaver?
- sandGorgon 8y agoIs this figma/sketch in vscode ? I would pay for this. Asian developers are Linux based generally - so it's hard to adopt Mac based tools (because of cost,etc). This would be a brilliant way.
- webwielder2 8y agoFigma/Sketch don't use the box model. They are modeled after illustration programs. In fact Sketch IS an illustration program that like Photoshop before it got pressed into UI duty.
- armandososa 8y agoI hope not. It's a very lousy and frustrating illustration program. I'd rather design whole interfaces in Adobe Illustration that draw even the simplest shape in sketch.
- mritchie712 8y agoFigma works in a browser, does it not work for you on Linux?
- sandGorgon 8y agoIt does. And we love it. But this is cool as well. Will work offline (which is still an issue in Asia)
- seanmcdirmid 8y agoMacs are pretty common in China and Japan, at least, especially in the IT/design industry.
- juandazapata 8y agoWe've completed a full circle and rebuilt Macromedia Dreamweaver. Yay!
- elryry 8y agoneed that FTP sync thoooo
- sktrdie 8y agoThe main difference is that now we actually have a proper grid layout system which enables editors to do their job properly. Things like webflow allow one to design responsive components without having to code anymore.
- gimliapp 8y agoCompletely agree with this. It would be very hard to build good tools around float, tables and inline-block which we used to work with. Also, I do find a bit surprising that browser vendors haven't looked more at what tools like webflow are doing.
- gatherhunterer 8y agoFirefox Developer Edition has visual tools for transition functions, font tooling, flexbox, grid, clipping and pretty much every CSS nuance. It's also available for free and always will be, is decoupled from your source code (while still providing you with visually-edited code if you want to make a change permanent) and is built into a browser.
- thanatropism 8y agoI know responsive design is important in a mobile-first world. But the grid systems I've seen (mini.css; it's my first web project in 15 years and I've decided not to use frameworks, just bash rocks together until the browser talks and listens to an API server) are nooot great. They're significantly wordier than old school tables, and significantly more confusing to write by hand too. The one good thing is that they shrink with window size. I know I shouldn't be coding up web "apps" by hand and instead learn React or whatever, but why should the whole making webpages an active hurdle for a techy person of average intelligence who can e.g. move some of his custom code from numpy to tensorflow? Maybe I didn't google the right things, but I expected something that allowed me to say "div id=topnavbar" or something. As opposed to a lot of width classes that... Next thing you know I'm not allowed to repair my TV despite having had a short protoboard-electronics hobby in my teens. I jest.
- gigatexal 8y agothis is extremely cool!
- sergiotapia 8y agolmao this is dreamweaver lite. we have to go back.
- Geee 8y agoLooks great, I'd definitely want to use this. Consider releasing this as a beta with discounted price.
- bobwaycott 8y agoThis looks really great. I want to try it out. Working on a couple new things, and new things are always the easiest to try other new things on. ;)
- jpincheira 8y agoI love your landing! Congrats :)
- vistriter 8y agoI very very love this. Help me to create flex box. :)
- Lord_Zero 8y agoPlz no more front-end GUIs. Save it for Wix.com.
- kaeland 8y agoThis looks awesome!
- robmccoll 8y agoYou might want to make the Kickstarter campaign more prominent - use color, make it bigger and part of the main content instead of just part of the top bar. Anyway, as a mostly backend and native / non-web person who occasionally has to do front-end development, this looks like a very useful tool! Something like this might convince me to start using VSCode for web dev over vim.
- neurotrace 8y agoIt's not a full replacement but VS Code actually has fantastic vim bindings
- jitl 8y agoI started trying to use VSCode’s vim bindings full time yesterday. The bindings themselves are pretty good, but VS Code is so slow compared to vim! I’m editing Typescript. Frequently my key presses lag for tenths of a second, or auto insert some unrelated identifier. I’m going to give it a week before I go back to nvim and Coc.nvim
- r_singh 8y agoWhat are your system specifications? And how many files does your project typically consist of?
- pass3hux 8y agohttps://www.letjamz.com/881/video-ty-dolla-ign-migos-party-don-t-start https://www.letjamz.com/881/video-ty-dolla-ign-migos-party-d...
- lagamemnon 8y agoThis is pretty cool. Are there any similar tools out there already that don't produce garbage HTML?
- tomlagier 8y agoVery cool demo. Great idea to build on top of VSCode distribution channel/platform, but I'm curious on how you plan on enforcing payment? edit: Also curious how you'll be implementing "find source" - just doing a string lookup for id/classname/attibutes? Will you be able to handle generated identifiers, e.g. css modules classnames?
- sic1 8y agoThis looks great, and could be a great tool to help some front-end developers. However, I must say, it's 2019, if you call yourself a front-end developer, and you do not know flexbox and grid - you are greatly missing out on an amazing radical change in how you think about and design your layouts. There really is no excuse for not knowing this stuff, especially with all the great resources out there to help you learn. Flexbox Zombies basically changed my life. It taught me the possibilities, and now I know them by hand. https://mastery.games/p/flexbox-zombies https://mastery.games/p/flexbox-zombies The same company has a paid game to learn about the grid (https://gridcritters.com/ https://gridcritters.com/), but I came across the resources below and did not buy it. Flexbox Froggy and Grid Garden are both free, not gated by an email signup, and very high quality. You and everyone on your team should do them, even if you think you know them well. It will help with reinforcement. - https://flexboxfroggy.com/ https://flexboxfroggy.com/ - https://cssgridgarden.com/ https://cssgridgarden.com/ I think Gimli is an amazing tool, and I might even buy it when it comes out. But please, do yourself and your team a favor - learn the tools by hand first. If you wrote a float at all this year, this post goes out to you.
- espresso_enigma 8y agoAgree with all of this, except that float still has a place. when you want text to flow around an element, float is great. I'm so glad that we don't need it for layout anymore, and I'm sure that's probably what you meant.
- nicoburns 8y agoAgreed, although these days I find more new developers who know flexbox, but not traditional layout method like inline-block and position:absolute. IMO it's key to know both.
- gimliapp 8y agoI don't think learning something necessarily mean knowing lots of names/properties by heart. You should however have a good idea of what grid and flexbox can do for you and when to use them I think. I personally have a hard time differentiating between properties such as justify-content / align-content / align-items / justify-items / justify-self and so on. To me those are just random words. Perhaps because English is not my first language, I don't know. I really think it makes a huge difference to see a small icon describing what properties have been set and to see the difference by hover instead of just reading/editing raw CSS. I've visited https://css-tricks.com/snippets/css/complete-guide-grid/ https://css-tricks.com/snippets/css/complete-guide-grid/ and https://css-tricks.com/snippets/css/a-guide-to-flexbox/ https://css-tricks.com/snippets/css/a-guide-to-flexbox/ countless of times. Some of the stuff just does not seem to stick tbh, especially if you have been working on something not-CSS related for some time. I'm sure some people just remembers everything, but i'm not one of them :)
- t0astbread 8y agoHey, this looks really neat! I have a few questions though. 1. If I use this tool, can I still collaborate with people that don't have it? This might be a concern to maintainers of free/open source projects who would like to use Gimli for themselves but not force others to use proprietary tools (which, I assume, Gimli falls under) when editing the project's source. 2. How does this handle components (when using a framework) that aren't presentational (like container components in React/Redux apps that subscribe to the store and pass data on)? Will you just be able to "drag them in" like visual components? Will there be an ergonomic way to add them into the tree later? (So that the designer can, for example, just focus on the visual aspect, then pass it on to a developer who adds the containers)
- rkido 8y agoI backed this. Visual data should be edited visually.
- deleted 8y ago[deleted]
- dang 8y agoThis should not have been posted as a Show HN. Show HN is for something that people can actually try. Fundraisers and teaser pages are ruled out in the rules: https://news.ycombinator.com/showhn.html https://news.ycombinator.com/showhn.html. (We've taken Show HN belatedly out of the title above.)
- pudebe 8y agoDo professional developers ever use these wysiwyg editors ?