The one framework you need
A
functional,
JavaScript only,
cross platform framework.
oneJS is a next generation, open source JavaScript framework for building modern apps for web and mobile from a single codebase. oneJS is not owned by any Tech Giant; it is an independent project developed by contributors from all around the world. oneJS is based on three principles:
-
Functional: Predictable, code efficient and easily testable. Pure functions are the building blocks of oneJS. Fall in love with the functional programming paradigm ❤️.
-
JS Only. Really: You can write your entire app in pure Vanilla JS or Typescript. That's right, not a single line of HTML, CSS or JSX needed. Can you believe it?
-
Cross Platform: Write the same code for web and native apps. Simplicity is our true cross platform weapon; reduce your effort and multiply your reach! Powered by [React][react] and [React Native's][rn] new architecture.
[react]: https://reactjs.org/
[rn]: https://reactnative.dev/
🗂️ Repository: core
This is the main oneJS repository. It contains all the functions to setup the app, customize the look and feel and manage the state. Head to the [docs][docs] section to discover all the
functions you can import.
🚀 Get Started
Open your terminal window and navigate to the folder that will contain your app. Once there type the command below:
``
npx @onejs-dev/create-app
`
Follow the instructions in the terminal to setup your app. Once ready, type the start command:
`
npm start
`
Visit the [Start!][start] section of our website for more in depth content.
[start]: https://onejs.dev/get-started
🧪 Example
Our best publicity is our own code. The example below is our version of the "Hello World!" staple:
`
js
/ Imports: Required modules to setup the app ================================================== /
import { app, read, update } from "@onejs-dev/core";
import { Text, View, Input } from "@onejs-dev/components";
/ State: Variable declaration ================================================================= /
const state = { name: "World" };
/ App Component: Returns the structure to be rendered ========================================== /
const AppComponent = () => {
return View({ content: { h: "center", v: "center", direction: "column" } })([
Text({ style: { fontSize: 22, paddingBlock: 60 } })(Hello ${read("name")}!
),
Input({ type: "text", value: read("name"), onChange: update("name") })
]);
};
/ App Function: Renders the App Component in the screen ======================================== /
app({component: AppComponent, theme: {preset: "oneJS"}, state: state });
``
100% JavaScript as promised. You won’t have to write a single line in any other language.
Use the online [Playground][play] to put your skills to test.
[play]: https://onejs.dev/playground
📖 Documentation
The full oneJS documentation can be found on our [website][docs].
You do not require extensive JavaScript knowledge to become an expert in oneJS; the [learn section][learn] will take you from zero to hero! It is composed of several units, each focusing on a key topic.
[docs]: https://onejs.dev/docs
[learn]: https://onejs.dev/learn
⚖️License
oneJS is MIT licensed.