Live data from Hacker News

Launch HN: Pagedraw (YC W18) – Compile UI Mockups to React Code

news.ycombinator.com

71–80 of 125 posts

Re: Launch HN: Pagedraw (YC W18) – Compile UI Mockups to React Code

#71
You talk a lot about the compiler backend. Suppose we use a different UI library other than the big ones like React and Angular. How can I plug in my custom backend ?

Do you have plans to open source the backend ? So devs over time can make it even smarter for all sorts of use cases ?

Open source and profitable are orthogonal things. You can still be profitable and build a solid product with a raving community.

Re: Launch HN: Pagedraw (YC W18) – Compile UI Mockups to React Code

#72
Really really like that you used VSCode's monaco editor.

Dunno how possible it is, but I would definitely pay for a vscode plugin to have a native app like experience.

Design -> Code is definitely a big problem. Creation time is one, but updating should be easy too.

Also I would love a reverse, code -> Design output as well, so it's a two way tweaking experience, where both design and code are always in sync. i.e React -> Sketch

Re: Launch HN: Pagedraw (YC W18) – Compile UI Mockups to React Code

#74
post #71

You talk a lot about the compiler backend. Suppose we use a different UI library other than the big ones like React and Angular. How can I plug in my custom backend ? Do you have plans to open source the backend ? So devs over time can make it even smarter for all sorts of use cases ? Open source and profitable are orthogonal things. You can still be profitable and build a solid product with a raving community.

Definitely! I'm glad to see this is on other people's minds :)

We're huge on backwards compatibility (and think everyone should be), which is why we don't want to expose something we haven't stabilized yet. We'll have a way to export our just-before-codegen internal representation (shame on me for forgetting the PL term) once it settles down a bit. It's very much like a DOM, so there's not too much craziness there.

We'll be launching a bunch more backends in the coming weeks, so there's a good chance we'll have first-party support for your favorite framework anyway :)

Re: Launch HN: Pagedraw (YC W18) – Compile UI Mockups to React Code

#75
post #72

Really really like that you used VSCode's monaco editor. Dunno how possible it is, but I would definitely pay for a vscode plugin to have a native app like experience. Design -> Code is definitely a big problem. Creation time is one, but updating should be easy too. Also I would love a reverse, code -> Design output as well, so it's a two way tweaking experience, where both design and code are always in sync. i.e Rea…

All credit for the monaco editor to our awesome friends at Stackblitz (stackblitz.com). Gonna announce the depth of that partnership soon ;)

Native VS Code integration is already here! The “3 screens” you see (design, code, preview) are just there for the demo— only the design editor on top is part of Pagedraw. You get to use your regular text editor (VS Code included), and localhost env if you use the full version and install the CLI https://documentation.pagedraw.io/cli/

> Design -> Code is definitely a big problem. Creation time is one, but updating should be easy too.

Updating is super easy if you do the updates in Pagedraw. Since everything is component based, you should never touch the generated code. All the code you write goes in adjacent components that import and are imported by Pagedrawn components. You never need to roundtrip, because you never need to edit the generated code

Re: Launch HN: Pagedraw (YC W18) – Compile UI Mockups to React Code

#77

I'm really curious how accurate the tool generates responsive designs. I feel like, it would have it's limits. It would be helpful to know what those limitations are before spending too much time and only to find out it won't work for us.

For sure, thanks for pointing this out. We have https://documentation.pagedraw.io/why-not/, but we're trying to be clearer about how exactly our layout system works with https://documentation.pagedraw.io/layout/.

We give you controls to annotate your design with layout behaviors. The css we generate is 100% accurate to the constraints you specify, but our constraint system doesn't capture 100% of desired layouts (yet!)

We have 2 ways for you to control responsiveness: A flexbox-y constraint system, and media queries (Screen Size Groups). They're roughly the same controls html/css give you, though hopefully presented in a cleaner manner.

Re: Launch HN: Pagedraw (YC W18) – Compile UI Mockups to React Code

#78
As a UI/UX guy, ReactJS/JSX is a very high bar for us to cross. I have tonnes of Sketch/Figma files ready to be wired, as a JS newbie, JSX is too complicated for a Designer mind to understand :-) Any hopes for a beginner friendly language like VueJS or Webcomponents (AMP Pages/Polymer).

The tool has great potential, if u can address the UX market than the dev market. Devs have many many tools they wont give up, but we do not have any hybrid browser based tools which can take a Figma/Sketch and wire it with logic (maybe Ionic Creator)

Re: Launch HN: Pagedraw (YC W18) – Compile UI Mockups to React Code

#79
post #56
post #53

Earlier quoted context omitted.

Then why is it a web app? What happened to open standards? Why not just make it a standalone application, following your logic?

You’re right, it’s not a web app. It is a stand-alone application built on top of Chrome the way that other apps are built on Qt or WPF.

Right, and I'm saying I fundamentally disagree with this vendor-locking approach. Qt doesn't lock me into a particular environment and is cross-platform. It's a view framework, not an entire browser. Huge difference.

Re: Launch HN: Pagedraw (YC W18) – Compile UI Mockups to React Code

#80

As a UI/UX guy, ReactJS/JSX is a very high bar for us to cross. I have tonnes of Sketch/Figma files ready to be wired, as a JS newbie, JSX is too complicated for a Designer mind to understand :-) Any hopes for a beginner friendly language like VueJS or Webcomponents (AMP Pages/Polymer). The tool has great potential, if u can address the UX market than the dev market. Devs have many many tools they wont give up, but w…

coming soon! We're just putting our pants on one leg at a time :)
Post reply on HN