DEV Community

Iain Freestone
Iain Freestone

Posted on • Updated on • Originally published at iainfreestone.com

🚀10 Trending projects on GitHub for web developers - 30th May 2020

Trending Projects is available as a weekly newsletter please sign up at Stargazing.dev to ensure you never miss an issue.

1. Responsively App

A modified browser built using Electron that helps in responsive web development.

GitHub logo responsively-org / responsively-app

A modified web browser that helps in responsive web development. A web developer's must have dev-tool.

Responsively Logo

Responsively App GitHub release

A must-have dev tool for web developers for quicker responsive web development. 🚀
Save time by becoming 5x faster!

Twitter contributors Discord XS:Code PRs Welcome Open Collective backers and sponsors

ProductHunt

Download Now (free!): responsively.app

Responsively App

A modified browser built using Electron that helps in responsive web development.

Quick Demo

Features

  1. Mirrored User-interactions across all devices.
  2. Customizable preview layout to suit all your needs.
  3. One handy elements inspector for all devices in preview.
  4. 30+ built-in device profiles with the option to add custom devices.
  5. One-click screenshots on all your devices.
  6. Hot reloading is supported for developers.

Please visit the website to learn more about the application - https://responsively.app

Download

The application is available for Mac, Windows and Linux platforms. Please download it from responsively.app

Alternatively, MacOS users can use brew Homebrew installs

brew install --cask responsively
Enter fullscreen mode Exit fullscreen mode

Also, Windows users can use chocolatey Chocolatey installs

choco install responsively
Enter fullscreen mode Exit fullscreen mode

or winget:

winget install ResponsivelyApp
Enter fullscreen mode Exit fullscreen mode

Linux users using an RPM Package Manager can use rpm

sudo rpm
Enter fullscreen mode Exit fullscreen mode

2. Algorithm Visualizer

Learning an algorithm gets much easier with visualizing it. Don't get what we mean? Check it out:

GitHub logo algorithm-visualizer / algorithm-visualizer

🎆Interactive Online Platform that Visualizes Algorithms from Code

Algorithm Visualizer

Introduction

Welcome to Algorithm Visualizer, an interactive online platform designed to bring algorithms to life through visualization. Whether you're a student, teacher, or professional, our platform provides an engaging way to explore and understand various algorithms.

GitHub contributors GitHub license

Languages and Frameworks Used

Languages

Key Features

  • Visualize algorithms from code:

    Algorithm Visualizer allows you to witness algorithms in action by visualizing code written in various programming languages. This visual approach facilitates a better understanding of algorithmic behavior..

  • Learn about Algorithms:

    Explore our collection of tutorials, articles, and videos that serve as valuable resources for learning about algorithms.

algorithms

In this repository, you'll find visualizations of algorithms showcased in the website's side menu. Contributions here directly impact the educational content available on the platform. https://github.com/algorithm-visualizer/algorithms

tracers

Explore the various visualization libraries in different programming languages. These libraries extract visualization commands from code. https://github.com/search?q=topic%3Avisualization-library+org%3Aalgorithm-visualizer&type=Repositories

Live Demo

Learning an algorithm gets much easier with visualizing…


3. Oak

A middleware framework for Deno's net server

GitHub logo oakserver / oak

A middleware framework for handling HTTP with Deno, Node, Bun and Cloudflare Workers 🐿️ 🦕

oak

jsr.io/@oak/oak jsr.io/@oak/oak score deno.land/x/oak npm Version

oak ci codecov

A middleware framework for Deno's native HTTP server Deno Deploy, Node.js 16.5 and later Cloudflare Workers and Bun. It also includes a middleware router.

This middleware framework is inspired by Koa and middleware router inspired by @koa/router.

This README focuses on the mechanics of the oak APIs and is intended for those who are familiar with JavaScript middleware frameworks like Express and Koa as well as a decent understanding of Deno. If you aren't familiar with these, please check out documentation on oakserver.github.io/oak.

Also, check out our FAQs and the awesome-oak site of community resources.

Note

The examples in this README pull from main and are designed for Deno CLI or Deno Deploy, which may not make sense to do when you are looking to actually deploy a workload. You would want to "pin" to a particular version which is compatible with the version of…


4. You Don't Know JS Yet

This is a series of books diving deep into the core mechanisms of the JavaScript language. This is the second edition of the book series:

GitHub logo getify / You-Dont-Know-JS

A book series on JavaScript. @YDKJS on twitter.

You Don't Know JS Yet (book series) - 2nd Edition

This is a series of books diving deep into the core mechanisms of the JavaScript language. This is the second edition of the book series:

     ...

To read more about the motivations and perspective behind this book series, check out the Preface.

If you're looking for the previous first edition books, they can be found here.

Titles

I recommend reading the second edition books in this order:

If you're looking for the previous first edition books, they can be found here.

Publishing

As always, you'll be able to read these books online here…


5. JavaScript Algorithms and Data Structures

This repository contains JavaScript based examples of many popular algorithms and data structures

GitHub logo trekhleb / javascript-algorithms

📝 Algorithms and data structures implemented in JavaScript with explanations and links to further readings

JavaScript Algorithms and Data Structures

🇺🇦 UKRAINE IS BEING ATTACKED BY RUSSIAN ARMY. CIVILIANS ARE GETTING KILLED. RESIDENTIAL AREAS ARE GETTING BOMBED.


CI codecov repo size

This repository contains JavaScript based examples of many popular algorithms and data structures.

Each algorithm and data structure has its own separate README with related explanations and links for further reading (including ones to YouTube videos).

Read this in other languages: 简体中文 繁體中文, 한국어, 日本語, Polski, Français, Español, Português, Русский, Türkçe, Italiana, Bahasa Indonesia, Українська, Arabic, Tiếng Việt, Deutsch, Uzbek

☝ Note that this project is meant to be used for learning and researching purposes only, and it is not meant to be used for production.

Data Structures


6. build-your-own-x

Build your own (insert technology here)


7. esbuild

An extremely fast JavaScript bundler and minifier

GitHub logo evanw / esbuild

An extremely fast bundler for the web

esbuild: An extremely fast JavaScript bundler
Website | Getting started | Documentation | Plugins | FAQ

Why?

Our current build tools for the web are 10-100x slower than they could be:

Bar chart with benchmark results

The main goal of the esbuild bundler project is to bring about a new era of build tool performance, and create an easy-to-use modern bundler along the way.

Major features:

Check out the getting started instructions if you want to give esbuild a try.







8. RealWorld example apps

See how the exact same Medium.com clone is built using any of our supported frontends and backends.

GitHub logo gothinkster / realworld

"The mother of all demo apps" — Exemplary fullstack Medium.com clone powered by React, Angular, Node, Django, and many more

RealWorld Example Applications

See how the exact same Medium.com clone (called Conduit) is built using different frontends and backends. Yes, you can mix and match them, because they all adhere to the same API spec 😮😎

While most "todo" demos provide an excellent cursory glance at a framework's capabilities, they typically don't convey the knowledge & perspective required to actually build real applications with it.

RealWorld solves this by allowing you to choose any frontend (React, Angular, & more) and any backend (Node, Django, & more) and see how they power a real-world, beautifully designed full-stack app called Conduit.

Read the full blog post announcing RealWorld on Medium.

Join us on GitHub Discussions! 🎉

Implementations

Over 100 implementations have been created using various languages, libraries, and frameworks.

Explore them on CodebaseShow.

Create a new implementation

Create a new implementation >>>

Or you can view upcoming implementations (WIPs).

Learn


9. Node Best Practices

The Node.js best practices list (May 2020)

GitHub logo goldbergyoni / nodebestpractices

✅ The Node.js best practices list (July 2024)

Node.js Best Practices

Node.js Best Practices


102 items Last update: January 3rd, 2024 Updated for Node 22.0.0

Follow us on Twitter! @nodepractices


Read in a different language: CNCN, FRFR, BRBR, RURU, PLPL, JAJA, EUEU (ESES, HEHE, KRKR and TRTR in progress! )


🎊 2024 edition is here!

  • 🛰 Modernized to 2024: Tons of text edits, new recommended libraries, and some new best practices

  • ✨ Easily focus on new content: Already visited before? Search for #new or #updated tags for new content only

  • 🔖 Curious to see examples? We have a starter: Visit Practica.js, our application example and boilerplate (beta) to see some practices in action

Welcome! 3 Things You Ought To Know First

1. You are reading dozens of the best Node.js articles - this repository is a summary and curation of the top-ranked content on Node.js best practices, as well as content written here by collaborators

2. It is the


10. Public APIs

A collective list of free APIs for use in software and web development.

GitHub logo public-apis / public-apis

A collective list of free APIs

Try Public APIs for free

The Public APIs repository is manually curated by community members like you and folks working at APILayer. It includes an extensive list of public APIs from many domains that you can use for your own products. Consider it a treasure trove of APIs well-managed by the community over the years.


APILayer Logo

APILayer is the fastest way to integrate APIs into any product. There are a lot of APIs available at APILayer Marketplace.


APILayer APIs

API Description Call this API
IP Stack Locate and Identify Website Visitors by IP Address Run In Postman
Marketstack Free, easy-to-use REST API interface delivering worldwide stock market data in JSON format Run In Postman
Weatherstack Retrieve instant, accurate weather information for any location in the world in lightweight JSON format Run In Postman
Numverify Global Phone Number Validation & Lookup JSON API Run In Postman
Fixer Fixer is a simple and lightweight API for current and historical foreign exchange (forex) rates.

For all for the latest rankings please checkout Stargazing.dev


Trending Projects is available as a weekly newsletter please sign up at Stargazing.dev to ensure you never miss an issue.

If you enjoyed this article you can follow me on Twitter where I regularly post bite size tips relating to HTML, CSS and JavaScript.

Top comments (1)

Collapse
 
terkwood profile image
Felix Terkhorn

esbuild looks promising! Thanks for the post 📯