Pure-Vue: Vue to PureScript bridge

[GENERAL] Summarize your solution to the problem.

Build a bridge from an accessible JavaScript framework with a rich HTML syntax (Vue) to the closest Haskell syntax (PureScript).

[GENERAL] Summarize your relevant experience.

I am JavaScript web developer for the last 9 years, working mainly with Vue on frontend. I started studying Haskell and PureScript last year, this year I completed the plutus pioneer program. Now I'm developing Cardano DApps.

[IMPACT] Please describe your proposed solution.

PureScript is a language very similar to Haskell which compiles to JavaScript, and is widely used to build frontend user interfaces of Cardano DApps.

Vue.js is an approachable, performant and versatile framework for building web user interfaces. It features the single file component format, which augments standard HTML with template syntax and custom script tags.

My proposal is to build an embedded domain specific language to bridge Vue Composition API to PureScript language inside Vue single file components. With this funding I would focus on implementing the proof of concept and release the final improved version.

[IMPACT] Please describe how your proposed solution will address the Challenge that you have submitted it in.

1. Vue is very popular among less experienced web developers: according State of JavaScript 2021 and Stackoverflow 2020, Vue is the third most used framework, the second with more awareness and desire.
2. Vue is already integrated with Vite, Vue-cli, Webpack, Rollup and many other frontend tools. Having a compiler step built into the Vue compiler will seamlessly expose the PureScript language to all these tools.
3. PureScript is the closest language to the Haskell language, having a way to step from JavaScript world to the Haskell world is currently the most difficult challange in the Cardano developer ecosystem.
4. Vue has an appealing template syntax targeting web developers.

These findings corroborate the challange solution requeriments, because it invites web developers of these frameworks to be familiar with Haskell. When this developer choose for a blockchain technology, he/she will try to find a familiar developer ecosystem, and PureScript will be the bridge to bring web developers to Cardano ecosystem.

[IMPACT] What are the main risks that could prevent you from delivering the project successfully and please explain how you will mitigate each risk?

1. Not having an easy way to inject PureScript code into the Vue compiler setup hook. It would be necessary to rethink the domain specific language approach or change the project scope to extend the purescript or vue compiler with specific features, requiring more time and funding.
2. I'm trying to anticipate this problem by building a proof of concept with a minimal example of composition API integration.
3. Actually making the development experience worse, because of extensive usage of specific domain language and subtitle changes from the default PureScript/Vue behavior.
4. I will try to reuse as much of the Vue APIs as possible and clearly document each behavior change on the PureScript side.
5. In fact, making the development experience worse, due to using a package manager for another language (PureScript).
6. I added in roadmap a new feature to install PureScript packages from the JavaScript package manager, this way we can mitigate this problem.
7. Not reaching the targeted audience
8. I'll list the project on awesome lists, divulgate on community channels (discord and forums). I'll also list the project on Cardano developer docs.
9. I have made a test on PureScript community and it already engaged some devs, we have 13 stars on the GitHub repo having only with the idea of the project.

[FEASIBILITY] Please provide a detailed plan, including timeline and key milestones for delivering your proposal.

• Q1: Proof of Concept
• Implement the proof of concept
• Announce the project on community channels
• Q2: Isomorphic API
• Mirror composition API whenever is possible without using compilation/transpilation
• Publish a landing page and a reference docs
• Q3: Improved API
• Improve ergonomics by adding more typed features and fine tunning the eDSL
• Improve internal developer experience on adopting upstream Vue changes
• Q4: Improved Tooling
• Creates/adopt a CLI to bridge PureScript package manager to javascript package manager
• Reduce the PureScript related boilerplate, fetching it from JavaScript config files.

[FEASIBILITY] Please provide a detailed budget breakdown.

For 12 months of development:

• 1x developer with PureScript and JavaScript expertise (Walker Leite): U$ 60,000.00
• 1x developer with Haskell/PureScript expertise (open): U$ 60,000.00

Total: U$ 120,000.00

[FEASIBILITY] Please provide details of the people who will work on the project.

• Walker Leite: I'm a full stack developer, in 2021 I started learning and using PureScript to build web applications that integrate JavaScript. This year I started using Haskell, completed the pioneer program and also did the initial coin offering in the Apexaverse project.
• 2nd Haskell/PureScript Developer:
• Must have experience with Haskell or PureScript language
• It's a bonus to have JavaScript experience
• It's a bonus to have experience writing compilers and/or building languages
• It's a bonus to have experience building DSL/EDSL
• It's a bonus to have experience building parsers

[FEASIBILITY] If you are funded, will you return to Catalyst in a later round for further funding? Please explain why / why not.

I don't think so, because the idea is to get an engaged community and fund its maintenance through project donations.

[FEASIBILITY] Are you or any member of your team working on any other proposals in this Fund9?

[FEASIBILITY] Are you or your team working on any other proposals from previous Funds?

[AUDITABILITY] Please describe what you will measure to track your project's progress, and how will you measure these?

To measure the impact of the project on the challenge, we chose these project metrics:

• Number downloads
• Number of unique visitors
• Number of template downloads
• Number of watchers
• Number of contributors

We'll also have some metrics to indicate progress of the project:

• Ratio of issues closed by issues opened
• Number of commits

[AUDITABILITY] What does success for this project look like?

We'll have an Cardano engaged community building dapps using Vue and PureScript on the frontend, and Haskell or PureScript on the backend.

[AUDITABILITY] Please provide information on whether this proposal is a continuation of a previously funded project in Catalyst or an entirely new one.

It's a brand new proposal, but I took inspiration from "Bridge Cardano to the Web with Vite" from F8 https://cardano.ideascale.com/c/idea/396809