{"id":20524276,"url":"https://github.com/aadilhasan/mini-js","last_synced_at":"2025-06-11T02:36:53.461Z","repository":{"id":57297591,"uuid":"102478136","full_name":"aadilhasan/mini-js","owner":"aadilhasan","description":"It is a small size frond-end javascript framework, with modern js framework features.","archived":false,"fork":false,"pushed_at":"2020-12-03T21:11:39.000Z","size":55,"stargazers_count":4,"open_issues_count":0,"forks_count":2,"subscribers_count":3,"default_branch":"master","last_synced_at":"2025-04-11T18:44:21.960Z","etag":null,"topics":["javascript","javascript-framework","javascript-library","js","js-framework","js-library","js-libs"],"latest_commit_sha":null,"homepage":"","language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":null,"status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/aadilhasan.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":null,"code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null}},"created_at":"2017-09-05T12:24:51.000Z","updated_at":"2024-08-22T10:22:34.000Z","dependencies_parsed_at":"2022-09-01T05:32:54.478Z","dependency_job_id":null,"html_url":"https://github.com/aadilhasan/mini-js","commit_stats":null,"previous_names":[],"tags_count":0,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/aadilhasan%2Fmini-js","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/aadilhasan%2Fmini-js/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/aadilhasan%2Fmini-js/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/aadilhasan%2Fmini-js/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/aadilhasan","download_url":"https://codeload.github.com/aadilhasan/mini-js/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":248814332,"owners_count":21165748,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["javascript","javascript-framework","javascript-library","js","js-framework","js-library","js-libs"],"created_at":"2024-11-15T22:48:48.836Z","updated_at":"2025-04-14T03:24:01.698Z","avatar_url":"https://github.com/aadilhasan.png","language":"JavaScript","readme":"# mini-js\n\nIt is javascript framework for frontend development heighly inspired by Vue JS. I am developing it just to learn and understand JS and its framework more, it is not meant to be used in production.\n[Check out a demo TODO app here](https://jsfiddle.net/aadilhasan07/7a4d56qo/19/)\n\n## features\n\nMini JS has features of modern JS frameworks, here are some of the features - \n\n* **Virtual Dom**- A lightning fast virtual dom which with a good diff algorithm for fast partial rerender.\n* **Two way data binding**- As soon as data gets change it will reflect in the ui.\n* **Native Directives**- such as m-on ([example](https://jsfiddle.net/aadilhasan07/2kfns190/8/)), m-for ([example](https://jsfiddle.net/aadilhasan07/rv205m1n/)), m-if ([example](https://jsfiddle.net/aadilhasan07/d7hfo4mx/)), m-literal:class ([example](https://jsfiddle.net/aadilhasan07/oy0cqedm/2/)) etc.\n* **Router**- for navigation between pages(routing)\n\n## installation\n\nTo use it you can install using **npm install --save mini-js** or use this CDN **https://cdn.jsdelivr.net/npm/mini-js/build/mini.min.js**\n\n## uses\n\n### html element\n\nMini needs an element in which it can mount the template or it which it can operate\n\n```\n\u003cbody\u003e\n\n\u003cdiv id='test_app'\u003e\n  \n  \u003cp\u003e {{best_fruit}} is the best fruit in the world \u003c/p\u003e\n  \u003cbutton m-on:click=\"change_best_fruit()\" \u003e change best fruit in the world \u003cbutton\u003e\n\n\u003cdiv\u003e\n\n\u003c/body\u003e\n```\n\n\n### initialize app\n```\nvar app = new Mini({\n    \n    el: '#test_app',\n    data: {\n      \n      best_fruit: 'mango',\n      fruits: ['apple', 'banana', 'berry', 'orange', 'cherry']\n      \n    },\n    methods: {\n    \n      change_best_fruit: function(){\n      \n        var index = Math.ceil(Math.random()*5);\n        this.best_fruit = this.fruits[index];\n      \n      }\n    \n    \n    }\n    \n});\n```\n\n## more examples will be added soon.\n","funding_links":[],"categories":[],"sub_categories":[],"project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Faadilhasan%2Fmini-js","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Faadilhasan%2Fmini-js","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Faadilhasan%2Fmini-js/lists"}