50 amazing tools for developers 2018

React tools

30. React Datasheet

An Excel-like spreadsheet component you can integrate into your React apps. Includes the ability to add formulas when a cell is edited (based on math.js) and the ability to add components like drop-down lists and buttons into the cells.

31. React Native for Web

This tool brings the platform-agnostic components and APIs of React Native to the web. Components include activity indicators, buttons, progress bars, toggle switches, scrollable views, and much more.

32. Reactide 

Reactide is described as “the first dedicated IDE for React web application development”. It's a cross-platform desktop app that will enable you to quickly render projects with no build or server configuration, reducing the complexity of building React apps.

33. React Studio 

This is a visual design tool that outputs clean, high-quality React projects, without coding. You can draw graphics or import from Sketch and build React components based on the designs. A really gutsy project, and worth looking into if you're a non-coder.

34. ORY Editor

A React- and Redux-based mobile-friendly content editor that you can plug into your site for rich content editing. It was originally built for a large open education platform in Germany, so the component is robust and easy to use.

Testing and coding tools

35. Terminus

This native terminal app available for Windows, Mac, or Linux includes theme and colour scheme options, configurable hotkeys, and lots more. It's apparently “designed for people who need to get things done”.

36. CodeSandbox

An online code editor enabling you to build web apps in React, Vue, Preact and Svelte. The interface includes a split view, Prettify, GitHub integration, and a dependency management panel to add npm packages.

37. Myjson 

A simple JSON store for your app that offers a CORS-enabled and SSL-supported API. Has the ability to generate a URL with your custom JSON data, or you can save the JSON to a page on the Myjson server via the website.

38. CSS in JS Playground 

The CSS-in-JavaScript thing is pretty hot right now. This playground enables you to examine and experiment with the code for various CSS-in-JS libraries, live in your browser.

39. PWABuilder

Progressive Web Apps (PWAs) are a huge part of what is helping the web to compete with mobile. This online tool helps you put together the different parts of a PWA, including the Web Manifest and Service Worker.

39. Vue.js devtools

 This Chrome or Firefox extension adds a ‘Vue’ panel to your browser’s developer tools. This will then assist you in debugging pages and apps built with Vue.js, the popular JavaScript UI framework.

40. GitHub for Atom 

Atom, the popular code editor, now has Git and GitHub integration available via this package. GitHut for Atom enables you to work with branches, staging, commits, deal with conflicts, and more. The package is bundled with Atom 1.18 and up.

41. Octobox

GitHub notifications aren’t useful, especially if you manage multiple projects. Octobox corrects some of the weaknesses inherent in GitHub’s notification system by using repo activity for archiving and unarchiving of the notifications.

42. Netlify CMS

CMS for static sites, which seems to be all the rage right now. Enables collaborators to create, edit, review, and publish content without writing code or dealing with version control. The React-based core acts as a wrapper for Git.

44. Lighthouse

Google’s automated tool for analysing page quality. Lighthouse enables you to test public or password-protected sites for performance, accessibility, and Progressive Web Apps. View your reports online, share them in JSON format, or as GitHub gists using Lighthouse Report Viewer.

45. Micro 

Micro is a terminal-based, configurable text editor. It's available for Windows, Mac and Linux, and aims to be easy to use while also taking advantage of the full capabilities of modern terminals. Available features include multiple cursors, strong mouse support and automatic linting.

Next page: Media tools