14 Web dev tools for all kinds of web developers

14 Web dev tools for all kinds of web developers

What are web development tools that are primarily needed for web development? Well, it’s web server (or servers), database server and development environment text editor, which actually is the writing program. A matter of taste decides what are the specific web dev tools to work. And at the stage of learning, you can use pretty much anything.

We`ll talk about latest development tools and web tools with a long history.

The story should start with the basics. It is IDE.

IDE is a software with broad functionality for writing, editing code. In addition to writing code in the IDE, there are many other necessary functions, for example, working directly with FTP, syntax highlighting, debugging and previewing pages. IDE has different possibilities, and choosing among them stands independently, based on your needs. For example, it may be PHPStorm, WebStorm, Eclipse, Netbeans and others.

As an alternative, you may use one of word processors, such as Notepad++. Sublime Text with a set of necessary web programmer tools for web development plugins.

But lately, cloud-based IDE became popular.

New web development tools: Online cloud-based IDE for web developers

Koding

KodingThe first impression from work with Koding is pleasant. Beautiful interface, soft colors. It has the ability to deploy a virtual machine with support for PHP, Ruby, Python, Node.JS and Perl, which you can configure via SSH terminal.

The source code editor is based on Ace editor. It works well, but it does not have all the opportunities that are there in the offline IDE (e.g. smart auto-complete). Koding is shareware IDE and its price starts from about 10 dollars.

Cloud 9

Cloud9Cloud9 offers to choose or add the project when you first start it. The project can be created based on virtual servers, FTP, or SSH.

After having chosen the project a welcome window opens, which is determined by the type of display interface (full IDE, minimal editor, sublime text), color theme, and other settings. On the left, there is a comfortable file Manager which supports drag & drop. The interface design looks quite standard but aesthetically pleasing.

When developing sites in this IDE, the result can be viewed in a separate interface unit. Its “preview” has one unusual feature: it gives you the opportunity to test the virtual site in different browsers and on different devices. This technology is provided by “Sauce labs”.

Cloud9 is shareware IDE, and you may use it for free using public workspaces and collaboration features.

ShiftEdit

ShiftEditShiftEdit has a very outdated interface design, from the era of Windows XP. The development environment supports the FTP Protocol, Google drive, Dropbox, WebDAV, SSH and Amazon S3. File Manager uses the mechanism of drag & drop.

Source code editor uses the free version of “Ace-editor”, with its bugs and poor features compared to offline IDE. ShiftEdit has the code navigation toolbar and live mode, but, unfortunately, it works not so good as it could.

In this IDE there are many different settings: action when opening images, the size of the tabs and fonts of the code editor, security and so on. There Pixlr is used to view the images. ShiftEdit is also shareware IDE.

Codeanywhere

CodeanywhereCodeanywhere is different from its competitors for it has apps for Android and iOS. Unfortunately, they are not well adapted to mobile platforms as their web version.

It is possible to deploy a Development box for html5 Node.JS, PHP, Ruby, C++, and Python. It supports SFTP, FTP, SSH, Dropbox and Google Drive, and its source editor works with “CodeMirror”. Like most web editors, it does not have smart auto-complete functions, refactoring, and other important and convenient features of offline versions of the IDE.

In this system, you can choose the encoding, various editor options, determine what programming language to display the file format, indicate the subject of the highlighter of the three options or create your own through the interface, change combinations and so on.

Done with online IDE. However, web development is not just writing code. Next, let’s talk about the basic tools required for web developer in addition to IDE

Apache HTTP Server

APACHE HTTP SERVERApache HTTP Server is the most popular free web server. It works both in Linux and in Windows. PHP easy connects to Apache. There are other web servers such as Nginx and Lighttpd, Apache is much superior in performance than others. Apache still is the most popular web server, still, at the stage of learning the difference in server performance will be invisible.

XDebug

wp_xdebugXDebugis is a PHP module which gives the ability to debug PHP scripts running on the server. XDebug connects to the IDE via TCP (NetBeans in our case) and conveys information about the state variables, and the development environment sends to XDebug commands for setting breakpoints and other.

WAMP server

WAMP SERVERYou may easily develop and test websites locally with WAMP.  WAMP makes it easy to install and administrate Apache, MySQL, and PHP development environment. If you are working on a large number of sites for clients, you must have such a server.

Pingdom

PINGDOMSolve problems with DNS and loading with Pingdom. You will see how much time it takes to download various resources for your website together with the overall performance.

Pingdom performs a quick and clear test of speed of loading of all the elements on the page and presents the results in a convenient chart where you can see which site elements are loaded slower than it is necessary and other areas of concern.

Browserstack

browserstackIt’s a favorite one from the entire set. Browserstack allows you to test the completed design in any browser and on any configuration you could think of.

Firebug

FirebugThe Firebug plugin for Firefox is an essential tool for developers.

Remarkably useful add-on Firebug from Firefox allows you to quickly debug, edit and monitor HTML, JavaScript and CSS, and all this directly in the browser.

One of the best tools for web developers, it must have those who work in web design.

Fontello

FONTELLOThis icon generator is truly one of a kind. Select the icons that you need, and Fontello will compile them in a dedicated web-font. You can also edit and customize the character codes and names.

Cloud Comp

Cloud ComputingThis intuitive and easy to use tool will help you to make the content of your website and applications available to others.

Cloud Comp was created specifically to give designers and developers the ability to grant privileges to their clients through the shell of the various devices.

Browser Shots

BROWSER SHOTSBrowser Shots takes screenshots of your websites in different browsers. Browser Shots generates images of how the website is displayed in six most popular web browsers with a resolution of 800 by 600 and 1024 by 768.

Just enter the website address and Browser Shots will open it from several computers and then upload the screenshots of the website.

Load Impact

LOAD IMPACTSuccessful is the one site which loads fast. Load Impact is a cloud-based service to simulate the loading test and optimization of the website, which generates loading on the site as when large volumes of traffic.

Load Impact lets you test how your website, web app, mobile app or API will cope with a flow of up to 1.2 million concurrent users. If you wonder what is web development tools for testing loading, Load Impact is the best one.

Related Posts

Leave a reply