Connect With WRD
feed via e-mail
feed via e-mail

Posts Tagged ‘IDE’

Coding websites is a long tedious process and there’s always more to learn. Why not make the job a little easier by writing code with an Integrated Development Environment? These programs(IDE for short) have syntax highlighting and many other features which expedite the coding process. This post features 11 web development programs which span the gamut of Windows, Mac, and Linux operating systems.

Visual Studio Express

visual studio express software webdev

Read the rest of this entry »

It is important to have a comfortable development environment to code better and faster.

And, there are numerous IDEs for that purpose, mostly paid and few free ones.

CodeLobster PHP Edition is a free IDE that has all the features we can expect. It is pretty powerful.

When starting, we can choose one of the many code-higlighting themes for the application (there are options which mimic the popular IDEs).


As the name states, it is suitable for PHP (or client-side) developers. A built-in debugger exists and a source-comment filter simplifies locating the right lines of any file so easily.

The UI has support for multiple tabs, code is highlighted successfully even if multiple languages are used on the same file and there is autocompletion for HTML, PHP, CSS and Javascript, including HTML5 and CSS3.

CodeLobster has FTP integration and uploading files to any remote address is simple.

The application has some handy and hidden features like “pressing F1 on any function or element gets you to a related documentation page about it” or “an index can help you locate them quickly”.

CodeLbster WordPress Plugin

Besides the free edition, there are 2 more versions: Lite and Pro where

  • Lite version:
    • is integrated to all the popular version control systems (Git, SVN, Mercurial, TortoiseSVN)
    • has an SQL manager that can produce all necessary actions on a database
    • supports LESS and SASS
    • has code validator, formatter and snippets
  • Pro version:
    • has all the features of Lite
    • has plugins for WordPress, Joomla, Drupal
    • has plugins for CakePHP, CodeIgniter, Symfony, Yii and Smarty
    • has plugin for jQuery
Coding with these plugins is very fast and easy as they have auto-complete and you don’t need to go back-and-forth to make sure you are using the right syntax.

The giveaway

CodeLobster is giving away 3 Pro licenses to WRD readers. You can join it by simply commenting to this post and winners will be selected randomly with the query below 1 week later (12 Nov 2013):

SELECT * FROM wp_comments WHERE comment_post_id=4771 AND comment_approved=1 AND comment_type='' GROUP BY comment_author_email ORDER BY RAND() LIMIT 3

Good luck to all.

  • Tags:
  • Filed under: Extras, Other License, Tools
  • Google has released a new tool, named Google Web Designer, for creating interactive HTML5 sites and ads.

    It is a modern WYSIWYG where you don’t need to dive into the code but use the features to get the output and the tools are mostly design-oriented.

    However, the code generated is always there and it can be edited or tweaked and the result is displayed automatically.

    Google Web Designer

    The tool comes with ready-to-use settings for designing Google-powered ads (DocubleClick, AdMob) that will work on any device.

    There are built-in components like 360 or carousel galleries, YouTube video embedding and more.

    A timeline exists for animations and anything can be drawn with a pen tool (not limited to shapes).

    Google Web Designer is currently in beta status and it is available for both Windows + Mac.

  • Tags:
  • Filed under: Extras, Other License, Tools
  • KineticWing is a free IDE that is lightweight, portable and works on all major operating systems (Mac support is mentioned to be coming soon).

    It is not a complicated IDE but more like a smart text editor with modern features.

    These features include support for Sass or Less (with built-in compiler), HTML5-CSS3 or CoffeeScript.

    KineticWing IDE

    A great feature is the ability to extending it with JavaScript plugins and there are already many like JSHint, JSLint, Less Compiler, JSBeauty..

    KineticWing is supporting server-side languages as well and more of them are being added within time.

    The editor is not yet perfect, it is in beta status, but the features and roadmap are very promising.

    Web apps are taking the places of desktop apps and the same is happening to our development tools as well.

    ICEcoder is an open source and web-based IDE that is built with PHP and works fast.

    It works by simply dropping its app folder to anywhere we prefer and any files there (and inside subfolders) are ready to be edited.


    The syntax of the code is highlighted, broken tags and HTML structure are displayed + allows selecting them easily.

    There is support for Emmet and comes bundled with Adminer (for managing MySQL).

    ICEcoder has a powerful JavaScript API for easily interacting with it and it works with many popular languages (PHP, JS, CSS, LESS, Ruby, etc.).

    When working on a project, after each CSS or JavaScript update, the need to refresh the browser is a time-loss (and it is usually done 10s of times).

    Tincr, a Chrome extension, solves this by integrating itself into Chrome’s Developer Tools and auto-refreshing the browser once these files are changed.

    Tincr Chrome Extension

    It is not bound to any IDE and works with all of them. There are several built-in project types (Ruby on Rails, Chrome extensions, Atlasian projects..) and custom ones can be created for any custom CSS/JS structure.

    Also, it -kinda- converts the Developer Tools into an IDE by adding an auto-save feature to changes made to the code from Developer Tools

    You may have heard of Zen Coding before and it now has a new name and website:

    Emmet is an editor plugin which has versions for many popular editors like Notepad++, Aptana, Coda, TextMate, Komodo Edit and more.

    Once installed, using a CSS-like syntax, it is possible to create bulk HTML and CSS code (or nay other programming language code) with a single line for coding quickly.


    For example, it can transform this command: ul#nav>li.item$*4>a{Item $} into an HTML unordered list with 4 items.

    It can also generate Lorem Ipsum text and much more complex outputs than the example above.

    There are various actions integrated for fastening the stuff more like splitting-joining, merging lines, browsing through important code points, etc.

  • Tags:
  • Filed under: Extras, Other License, Tools
  • 1 Comment
  • Working completely online is not only a getting popular trend but also something that happens slowly in the background almost without us realizing it.

    Many of us have online storage accounts to host our documents/codes, lots of web apps exist to help us accomplish our daily tasks (image editors, cross-browser testing tools, etc.).

    Orion Web IDE

    Orion, by Eclipse, is an open source and online IDE application (that is alternative to others) which can be a good alternative for anyone willing to create code online.

    It has 2 versions, hosted or self-hosted, and the self-hosted version requires Java to run.

    The application supports working with multiple projects, creating files/folders, FTP and there is Firebug + Git integration.

    Orion is extensible with its plugin system and it is well-documented.

  • Tags:
  • Filed under: Extras, Other License, Tools
  • Codiad is an open source web-based IDE application for writing and editing code online.

    The application is built with PHP and doesn't require a SQL database but stores the data in JSON formatted PHP files.

    Its interface has 3 panels:

    • project/file manager
    • code editor
    • menu/actions 

    where the left and right panels can be hidden on request for maximum coding space.

    Codia Web-Based IDE

    Codiad is capable of handling multiple projects with a single installation and any number of users can login to the application.

    It removes the need of creating a local test/development environment and enables anyone to keep all data + the development process in a remote server.

    Even though the application is still in an early development phase, it is mentioned to be stable and has an API for further improvements.

    When writing CSS code, adding CSS properties in a specific order for each rule helps reading it easier so much.

    For anyone who already does that or not, CSScomb, a free service sorts CSS properties in any order you want (and, their default order is pretty good too -from the most to least important-).

    It works with both single + multi-line CSS code and besides the online version, there are add-ons provided for the most popular IDEs.


    Uptime Robot