Overview
Hi everyone ๐๐ผโ
In this article, I'm going to look at seven OSS repository that you should know written in JavaScript, interesting projects that caught my attention and that I want to share.
Let's start ๐ค๐ผโ
1. Appwrite
Appwrite is an end-to-end backend server for Web, Mobile, Native, or Backend apps.
You can easily integrate your app with user authentication, a database for storing and querying users and team data, storage and file management, image manipulation, Cloud Functions, and more services.
Our Appwrite Init event has concluded. You can check out all the new and upcoming features on our Init website ๐
Appwrite is a backend platform for developing Web, Mobile, and Flutter applications. Built with the open source community and optimized for developer experience in the coding languages you love.
English | ็ฎไฝไธญๆ
Announcing Appwrite Cloud Public Beta! Sign up today!
Appwrite is an end-to-end backend server for Web, Mobile, Native, or Backend apps packaged as a set of Docker microservices. Appwrite abstracts the complexity and repetitiveness required to build a modern backend API from scratch and allows you to build secure apps faster.
Using Appwrite, you can easily integrate your app with user authentication and multiple sign-in methods, a database for storing and querying users and team data, storage and file management, image manipulation, Cloud Functions, and more services.
Find out more at: https://appwrite.io
Table of Contents:
-
Installation
- โฆ
2. melonJS
melonJS is an HTML5 game engine that empowers developers and designers to focus on content.
The framework provides a comprehensive collection of components and support for a number of third-party tools.
It is an alternative to other JavaScript game engines such as Phaser ๐ค
melonJS 2
A fresh, modern & lightweight HTML5 game engine
melonJS 2 is a modern version of the melonJS game engine that was first released in 2011. It has been rebuilt entirely using ES6 class, inheritance and semantic, and bundled using Rollup to provide modern features such as transpiling and tree-shaking.
Note: migrating an existing project to melonJS 2 (version 10.0 and higher) will definitely break your game (ES6 semantic and inheritance, nodeJS event emitter, and no backward compatibility with deprecated legacy APIs), and you might want to read first this small step by step guide on upgrading to melonJS 2. If you are looking at the legacy version (9.x and lower) of melonJS, you can find it here under the legacy branch.
melonJS is open-source, licensed under the MIT License, and actively developed and maintained with the help of a small team of enthusiasts at AltByte inโฆ
3. GDevelop
GDevelop is another free, open-source game engine build from any platforms like PC or phone.
The peculiarity of this game engine is that it is possible to create video games without using code, because it uses a logic system based on conditions and actions.
GDevelop is a full-featured, no-code, open-source game development software. You can build games for mobile, desktop and the web. GDevelop is fast and easy to use: the game logic is built up using an intuitive and powerful event-based system.
Getting started
| โ I want to... | ๐ What to do |
|---|---|
| Download GDevelop to make games | Go to GDevelop website to download the app! |
| Contribute to the editor | Download Node.js and follow this README. |
| Create/improve an extension | Download Node.js and follow this README. |
| Help to translate GDevelop | Go on the GDevelop project on Crowdin or translate in-app tutorials. |
Are you interested in contributing to GDevelop for the first time? Take a look at the list of good first issues, good first contributions or the "๐ not too hard" cards on the Roadmap.
Overview of the architecture
| Directory | โน๏ธ Description |
|---|---|
Core |
GDevelop core library, containing common tools to implement |
4. Egg.js
Egg.js is a simple library that allows you to easily add web easter eggs by watching the user's key strokes.
It's simple to use and very funny ๐คฃ
Egg.js
Egg.js is a simple JS library that has no prerequisites and allows you to easily add web easter eggs by watching the user's key strokes.
Example
It's really easy to use. Just include the egg.js file on the page...
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/egg.js/1.0/egg.min.js"></script>
(Thanks to Cloudflare for hosting the library!)
...then use the addCode() function to add in your easter eggs. You need to pass it the character sequence to trigger the easter egg callback (which can either be in plain English or Javascript key codes), a function to trigger when it happens, and an optional set of metadata. Metadata can be anything from a string to an object.
var egg = new Egg();
egg
.addCode("up,up,down,down,left,right,left,right,b,a", function() {
jQuery('#egggif').fadeIn(500, function()โฆ5. API Vault
API Vault is a beautiful project written in JavaScript: it's an online platform that works as a gateway to a world of public APIs.
You can also filter the APIs by category and find the one that's right for you ๐
Prerequisites โข How To Use โข Credits โข Contributing โข Support โข License
Built with
Prerequisites
Before starting to use the software make sure you have docker installed.
How To Use
Clone the repository
git clone https://github.com/exifly/ApiVault
Set .env file
Inside root repository folder rename .env.dev file
cat .env.dev > .env
Inside /frontend folder rename .env.sample file
cd frontend
cat .env.dev > .env
Same action inside /backend folder
cd backend
cat .env.dev > .env
Client/Server side using Docker
# Go into the root folder
cd ApiVault
# Run docker
docker-compose up
Important note:
On first docker-compose launch, your terminal could tell you:
database_dev | 2023-05-26 13:38:01.598 UTC [83] ERROR: relation "vault_api" does not exist at character 232
database_dev | 2023-05-26 13:38:01.598 UTC [83] STATEMENT: SELECT "vault_api"."id", "vault_api"."name", "โฆ6. sweetalert2
sweetalert2 is a beautiful, responsive, customizable, accessible replacement for JavaScript's popup boxes without external dependencies.
Primarily designed for JavaScript projects, you can integrate it with the three big frontend frameworks: Angular, React, and Vue.
sweetalert2
/
sweetalert2
โจ A beautiful, responsive, highly customizable and accessible (WAI-ARIA) replacement for JavaScript's popup boxes. Zero dependencies. ๐บ๐ฆ
A beautiful, responsive, customizable, accessible (WAI-ARIA) replacement
for JavaScript's popup boxes. Zero dependencies.
Installation | Usage | Examples | Recipe gallery | Themes | React | Angular
Sponsors
For all questions related to sponsorship please get in touch with me via email sweetalert2@gmail.com
NSFW Sponsors
Important notice about the usage of this software for .ru,
โฆ7. Video.js
Video.js is a web video player built that supports HTML video and Media Source Extensions, as well as other playback techs like YouTube and Vimeo. It supports video playback on desktops and mobile devices.
As with sweetalert2, you can integrate this library with the three JavaScript frameworks: Angular, React, and Vue.
Video.js is a web video player built from the ground up for an HTML5 world. It supports HTML5 video and Media Source Extensions, as well as other playback techs like YouTube and Vimeo (through plugins). It supports video playback on desktops and mobile devices. This project was started mid 2010, and the player is now used on over
50,000100,000200,000400,000700,000 websites.
Table of Contents
Quick Start
Thanks to the awesome folks over at Fastly, there's a free, CDN hosted version of Video.js that anyone can use. Add these tags to your document's <head>:
<link href="//vjs.zencdn.net/8.3.0/video-js.min.css" rel="stylesheet">
<script src="//vjs.zencdn.net/8.3.0/video.min.js"></script>
For the latest version of video.js and URLs to use, check out the Getting Started page onโฆ
Conclusion
This list lists seven open source projects that are worth checking out, either to use them or even to contribute๐
Happy coding!โจ
Hi๐๐ป
My name is Domenico, software developer passionate of Vue.js framework, I write article about it for share my knowledge and experience.
Don't forget to visit my Linktree to discover my projects ๐ซฐ๐ป
Linktree: https://linktr.ee/domenicotenace
Follow me on dev.to for other articles ๐๐ป
Top comments (5)
I wanna add Editor.js, because when it comes to use a WYSIWYG editor it is the best choice . If you wanna enhance your coding skills then this masterpiece is for you!!
Hi @shahwaix_karim_23 !
Thank you for the tip, I'll take a look as soon as I can :)
You're welcome! dude.
Happy coding!
Great list! Never heard of sweet alert. What a cool library!
Thank you for sharing!
You're welcome!
It's a pleasure :)