Create-Raid-App: A fast setup for Raid Dapps.

[jordanlesich]

Project Idea

Create-Raid-App: An opinionated starter framework for dapps

Project Submitted By

Jord

Summary

Create-Raid-App is a starter mono-repo designed to get devs up and running as fast as possible. It is opinionated and follows the conventions used in most Raid Guild Dapps. Here's what it does:

• Automatically installs dependencies that are nearly ubiquitous in Raid Guild Dapps like web3Modal, Apollo, Chakra UI, graphQL, ethers.js, etc
• Uses npx so that it can be installed without having to clone or download the repo first.
• Comes preconfigured with the central state management system that is already used in many Raid Dapps. This includes the preconfigured custom hooks and initializers that organize application-wide state. These will all be set up in one central store. Non-essential hooks will be commented out, and the developer can opt in by uncommenting the hooks they wish to use. (similar to truffle-config.js).
• Includes but does not change the minimalistic contract development package found in create-eth-app.
• Comes preconfigured with utilities that automate time-consuming common tasks like web3signIn, chain-change state updates, and local caching. Provides set up code for initializing services like The Graph.
• Has custom prettier and eslint configs so project leads can maintain consistent syntax among devs.
• Is well documented and provides an easy-to-follow set up guide for new Raiders.

Ideas for the future:

• A prebuilt docker image for managing API-keys and dependencies across different dev environments
• Cookbook documentation for building out common services.
• Front end Jest testing suite.
• Logic extracted from components into functional utilities, especially for API calls.

Bonus Points:

• Badass Raid template screen, similar to the one create-react-app has on App.js.
• Configures Yarn Packages to optionally opt out of dependencies on build. For example if a dev would like exclude the contract development package, they could use the command 'npx create-raid-app @onlyfrontend'. This allows developers to quickly make cuts and minimize packages that aren't needed.

Why should we build this?

1. For fast implementation. This would be great for devs looking to build lighter production apps as well as weekend hackathon rips.
2. Consistency. If we're using similar repos, it becomes easier to read and debug each other's code.
3. Continuous Improvement. By having the entire guild scrutinize and improve a single repo, we can slowly improve the starter, finding creative ways to make the repo more useful over time.
4. Fast learning and onboarding. While there are many great libraries out there for getting started with dapps, few teach how to put all these tools together. The docs will get into the why of the code, so that new devs will be able to grok key concepts.

Anything else you'd like to add?

I'd love to people's thoughts and ideas.

Raid Party Skills Needed

• 2 Warriors (front-end devs)
• 1 Scribe

Cost (in USD):

1,750 DAI

[pi0neerpat]

This would be really cool, and something I'd be interested in contributing to. I have my own stack that I'm slowly improving.

• redwoodjs framework (react frontend + prisma backend + Apollo + scaffolding tools)
• tailwindcss (can swap for any styling you want)
• etherjs
• @oneclickdapp/ethereum-auth web3 login/auth I built

source example: https://github.com/pi0neerpat/nifty-chess-app/ demo: https://niftychess.com/

This provides

• full stack app w/ Apollo graphql
• easily deployed to vercel
• can choose frontend / backend or both
• gives you ability to write serverless functions without any complexity.

I wasn't too impressed with the other web3 scaffolding tools. Most of it I felt just gets in the way. With this approach, you start with a very vanilla React app, but its easy to iterate all the way to a fullstack production app.

Downside is that redwoodjs is still under development, but the upside is that we have the opportunity to shape its development, and be early adopters of something I think is going to soon compete with the other major JS FE frameworks.

In general I think this proposal needs a lot more data and feedback. Whats the best place to see what guild devs are building with today?

Also I think a good approach might be to create a few templates, and then see which templates are used the most, get feedback, before spending time to package it up into create-raid-app.

[jordanlesich]

Definitely on board with making this an ongoing, research effort before packaging it up. I made this proposal way back, and I didn't quite understand the landscape. Agreed on keeping it less tooled/more vanilla to start out. I'm also into the idea of prototyping and testing it out before packaging something up.

But I've also been thinking of having a sort of 'recipe book' instead of a bundle. Basically an archive of articles that contain code and patterns for solving common web3 problems. They should also contain some high-level reasoning behind these design choices to spur an ongoing debate. For me, that's where we can really add some value. It's one thing to have a collection of common packages, it's another to have conventions/code that we understand, can customize, and iterate on as a community.

We should have a meeting about this some time.

[pi0neerpat]

Yeah! A cookbook + best practices sounds super duper useful.

Probably the best thing to do is to start throwing notes into a Docs site. Do we have a docs site yet, or does anyone have suggestions for a docs site?

[jordanlesich]

No docs yet. I'm okay with whatever format. HackMD might be good for a quick start.

[plor]

I hope I'm not out of line by closing this out. If there are updates on this or further work that should be pursued, we should absolutely revive this. But this doesn't seem under consideration so I'm going to clear it out.