Must-have tools and services for Front-End Web Development ~ Coding Savvy
Coding Savvy FB Twitter Google
» »

Must-have tools and services for Front-End Web Development

To have an efficient front-end development environment require more than just the right skills, It needs to be with the right tools. This web development tools make our work easier every day. As a for a web developer/ web designer you can not help but have this tools and service readily available for every project. This tools are what add grease to the wheels of your development process and make things run smoothly without unnecessary rough patches. I have taken my time to look around the web and search for tools that are needed to have more front-end development environment on your PC and here they are base on developers remarks. It not necessary for you to have more than one tool that performs a single task but it your choice to determine the tool that suit your taste.
Must have tool and services for Front-End Web Development
For instance me, I prefer Notepad++ on Windows PC as my default editor and ATOM on my MAC.

Design:

Photoshop CC :- There’s a good reason why the classics are classic. With Photoshop, Adobe wrote the book on image manipulation, and the latest version remains at the cutting edge, with innovations such as automatic slicing and exporting image assets.

Adobe Illustrator CC: Create production-quality artwork on your mobile devices as well as your desktop. And get immediate access to all your assets — including Adobe Stock images — from right inside Illustrator. See how the fastest Illustrator ever helps you go from first idea to finished artwork just like that.

NPM: Package Manager


  • Grunt or Gulp for managing and automating all tasks from preprocessing languages to minifying the code for performance.
  • Yeoman recipes for scaffolding out projects of any type.
  • Bower for easily installing any project dependencies.
  • Preprocessors:

    SCSSor Stylus for CSS
    Haml for HTML
    Babel, Coffeescript or LiveScript for JS

    Test Editors:



  • Git for managing versioning and Github for hosting the repositories
  • Jira for following the agile software development approach, also used for bug tracking
  • Codepen for quickly creating  smaller components, sharing with the team, finding inspiration
  • LiveReload
  • WinMerge - for merging two different codebases and finding differences
  • Google/Firefox Developer Tools for testing, emulating devices, debugging
  • Was this article helpful?
    Thanks! Your feedback helps us improve tutorials.

    You May Also Like...

    2 comments: