Community Q&A: the Card Folio App
Cardstack’s full-stack fintech demo application
Card Folio, the decentralized finance sample app recently demoed to our community on Discord, showcases the Cardstack Framework’s ability to synthesize disparate data sources across blockchains and the cloud. The app’s code has been officially open-sourced, with more documentation on the way.
This full-stack fintech application provides live tracking of cryptocurrency portfolios by reading a combination of hardware wallet data, public on-chain data, and public exchange APIs. It can be reused and generalized very easily by developers to create an ecosystem of cards orchestrated by our data fusion layer, the Cardstack Hub. This, along with our composable user experience, allows developers to quickly build apps that take advantage of new decentralized Web infrastructure while connecting to the current Web.
Following our recent demo, we received a great response from our community. Below are answers to questions we received about Card Folio, our application stack, card composition, and more.
What Cardstack tools were used in the development of the Card Folio demo (4 Edges etc.)?
Card Folio uses the following Cardstack modules:
- Cardstack Hub as an orchestration server for synthesizing on-chain transaction data, third-party currency exchange data, and local user portfolio preferences data
- Ethereum plugin for full indexing of Ethernet mainnet transactions, to support instantaneous retrieval of any arbitrary address and its transaction history
- Git and GitHub plugin for storing and retrieving users’ personal portfolio settings and wallet address data
- Card-based APIs for creating and nesting assets, wallets, transactions, portfolios, and user identity schema, logic and templates
- Server-side computed properties to correlate and compute mathematical formulas on an event-driven basis
- PostgreSQL-based continuous indexing, using search engine-style retrieval for fast rendering of views with many aggregates
- Continuous integration (CI) and Terraform-based automated deployment pipeline for Amazon Web Services (AWS)
- Additional middleware capabilities
While 4 Edges is not included in the Card Folio codebase, it will soon be incorporated to support asset actions (such as initiating transfer of an asset to another wallet). 4 Edges is part of the Cardstack Environment, meaning every app built on our Framework will be able to leverage the “edges” to provide a standardized user experience.
Visual assembly of cards is part of our integral design and architectural goal — you can see an example of how individual cards move here. Supporting these movements via drag-and-drop is forthcoming, along with the system-wide introduction of Library (bottom edge).
How long did it take to develop the app based upon the Framework?
The user-facing part of our Card Folio app was built by one of our developers in four weeks, from late December to mid-January. Our goals were to design an app that would exercise a good number of APIs in the underlying framework, and to create a sample app that could be open-sourced to help new developers learn the conventions of our software stack.
Do cards automatically have a back-end module as well?
A card is a vertical stab through the architecture — there is no special module for the back-end. This means in order to get started building, app developers only have to worry about defining the schema, business logic, templates, relationships, and data source mappings, which are then deployed in a server running on Node.js.
The Cardstack Hub is similar to a Backend-as-a-Service you can host yourself: your definitions create the data model for your front-end code, and the standard REST/JSON API features are already provided. This makes Cardstack one of the few, if not the only, BaaS that connects to blockchains, not to mention composites data across blockchain and cloud APIs.
How is Cardstack different from a decentralized WordPress?
While WordPress specializes in standalone websites, Cardstack supports the creation of an entire cooperative ecosystem, where individual instances of Cardstack can join a network and share data, content, and value (i.e. revenue sharing).
In other words, when you quit Facebook and move to WordPress, you lose the network effects. But if you use Cardstack instead of WordPress, your website can be both since you’ll be part of a blockchain-backed network that shares code and resources. Through Cardstack’s plugin catalog, we hope to become a conduit for decentralized innovations wrapped in user-friendly Card UI and made accessible to other developers.
Will there be ready-made templates/decks like WordPress has?
Yes — a Cardstack app is essentially a collection of inter-dependent templates. As a downstream user, you can choose to adopt the entire suite of templates, or you can select a single card to use as part of your app.
Initially, we plan to support distribution of templates via the existing “theme market” channels. Our goal is to get us away from the Wordpress paradigm of $15-per-site themes, and toward a token economics model where royalties are paid out based on proportional attribution formulas based of usage, governed by a smart contract.
Will there be an editor to create Decks/sites? If so, will it be online or desktop?
There is little difference between online or desktop, because Cardstack is designed to run on the cloud via a web browser.
After solidifying the app, framework and deployment code for the cloud version, we’re building a hosted version of card.space for the community to play with and begin contributing to.
We’ve also completed a proof-of-concept of Electron (Chromium with Node.js) app integrated with Docker for running databases like PostgreSQL and a Geth (Ethereum) node.
Will the cards be commercial or free?
Our aim is to have most cards in the ecosystem open-sourced on GitHub then distributed as public NPM (JavaScript package manager) modules. Because we understand certain cards might touch enterprise data sources, we will also support private NPM modules that can be monetized via traditional licensing.
Will there be awards in Cardstack Token (CARD) for card publishers?
We want to incentivize card creators to make their card and its source code available for the ecosystem to use and remix. Our shared revenue model means if your card is used by another app, you will receive a reward as a small percentage of the total revenue generated by that app.
This mechanism encourages the open-sourcing of cards, and discourages private repositories and NPM modules as part of the larger smart contract and side-chain R&D effort at Cardstack — we will have updates on this effort in the near future.
In which way can cards be extended? Can individual classes be extended? And will it be standardized by the use of only one language, like JS f.e.?
Cards are written in a combination of JavaScript, CSS, and HTML, with Handlebar directives. If you need to connect logic that can’t be implemented in JavaScript (for example, if there is a need to tap into the Python ecosystem for machine learning code), you can create a Cardstack Hub plugin as a middleware running on NodeJS, that in turn connects to a Docker container holding the “native” code.
In simple terms, Cardstack supports deep and differentiated capabilities through Docker Hub packaging and distribution mechanisms, and supports broad, common capabilities through JavaScript and the NPM ecosystem.
Because cards are built from JavaScript, we support all ES6 functionality such as classes and extending classes. We also use Ember Addons, which have a higher level means that allows for extension of functionality.
Can the card’s CSS be overwritten/extended as well?
The Cardstack Framework does not impose global CSS styling to card-based applications — each card needs to have its own CSS defined and scoped to its boundary. It is important that CSS in Card UI not cascade from parent containers, as the card can be moved out of the container and into another view.
Cards can import styles from another theme via an addon mechanism. We expect the community will come up with CSS vocabularies and standardized styles for different types of apps built on Cardstack, whether it is for more content-oriented apps, or something like a fintech app.
Will there be a card/deck store?
We plan to catalog high quality cards that have been open-sourced by the developer community and host it as part of card.space, our community curation site.
While this will be curated by Cardstack moderators in the early stages, our aim is to move to a Token Curated Registry (TCR) once the catalog is up and running, leveraging CARD token as the governance and staking token.
Will the decentralized part of a card, like a decentralized cloud, be pre-set?
A card is decentralized because it can be deployed on either a cloud or a desktop, and on many different instances of Cardstack. We want to lower the barrier to entry for decentralization by making it extremely easy to deploy to card.space through default cloud services.
By encouraging teams from around the world to join the Cardstack ecosystem and compete on price and features, we grow the network while providing consumers with more choices.
Watch the full Card Folio community demo. Want to see our next community demo? Join our Discord.
