Giter VIP home page Giter VIP logo

alem's Introduction

Alem logo

Além

Além is a web3 JavaScript / TypeScript library to create web3 apps for Near BOS.

Alem makes it painless to create interactive UIs. Design simple views for each state in your application. Declarative views make your code more predictable, simpler to understand, and easier to debug.

Build encapsulated components that manage their own state, then compose them to make complex UIs. Since component logic is written in JavaScript, you can easily pass rich data through your app.

Documentation - Learn how to use Alem in your project.

If you have questions or need help, please ask in the Alem Discussions.

Support Além

Sponsor

Installation

You’ll need to have Node 18.0.0 or later version on your local development machine. You can use nvm (macOS/Linux) or nvm-windows to switch Node versions between different projects.

Also, make sure you have Git installed on your machine.

Use the command below to start an initial boilerplate.

JavaScript

# Npx
npx create-alem-dapp my-app
cd my-app
npm start
# Yarn
yarn create alem-dapp my-app
cd my-app
yarn start

TypeScript

# Npx
npx create-alem-dapp my-app --template typescript
cd my-app
npm start
# Yarn
yarn create alem-dapp my-app --template typescript
cd my-app
yarn start

TypeScript with Tailwind

# Npx
npx create-alem-dapp my-app --template typescript-tailwind
cd my-app
npm start
# Yarn
yarn create alem-dapp my-app --template typescript-tailwind
cd my-app
yarn start

CLI

Além has its own command system. To use it, install Além globally.

# npm
npm install alem -g
# yarn
yarn global add alem

Get to know more about the CLI here.

Documentation

You can find the Alem documentation on the website.

Check out the Getting Started page for a quick overview.

Contributing

The main purpose of this repository is to continue evolving Alem core, making it faster and easier to use.

License

Alem is MIT licensed.

alem's People

Contributors

m-rb3 avatar wpdas avatar

Stargazers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar

Watchers

 avatar  avatar

Forkers

m-rb3 aluhning

alem's Issues

RouteLink causes ExecutionError

When I try to use in the code it throws the following error:

Execution error:
styled() can only take styled components, Radix component names (EG: "Accordion.Trigger"), or a customElement name (EG: "Link")

Confirmed that if I replace the RouteLink with a tag, error goes away. Have also tried removing all but the to parameter in RouteLink in event something else was causing it, but error persists.

[ENHANCEMENT] Create routes from pages

It'd be really cool if we could use the compiler to do something similiar to Next.js -- something like: components in "page" directory get compiled into routes (with ).

These pages remain normal widgets so they can hold state. useStore, useLocation, etc get's passed as prop to each page widget.

The devs.near/widget/App module and devs.near/widget/Router module currently use pages from an array to create these routes (although not lazily, as alem sorta does). This could be an easy integration for apps using this pattern

[ENHANCE] Improve File Change Detector

Improve the file change detector logic. Rn, every time a file is changed, it processes all the files again. I'll create a way to re-process only the files affected by the change;

[ENHANCE] Local Modules: Try to automate this functionality

Currently, for a file to be considered a module it is necessary to move it into the modules folder. This happens because depending on the files, the final package may be larger instead of smaller.

Some options to be tested again:

  1. Check if the file is stateless or a simple .ts or .js file;
  2. Check if these files support Widgets within them;
  3. If items 1 and 2 are compatible, the compiler should interpret such files as local modules automatically.

Some points from previous tests:

  1. When similar logic to the above was tested, the final package was much larger. Most likely because there are small separate files that were created like this because of the limitation of Além in its first alpha versions;
  2. When retaking the tests, you must gather as many files as possible.

Feature: Import Image Files

Add import image files feature: This will convert the images to base64 and embed them into the code. There will also be a prop to config the image compression;

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.