![]() Talking about Chrome extensions, the Chrome store is full of powerful ones. We personally use the one bundled in the Grunt watcher plugin, as well as this simple Chrome extension as a client (which has the advantage of being switchable, because you don’t always want live reload, after all). The client/server comes in various implementations. How many times on average do you hit the refresh key on your keyboard every day? A lot, right? LiveReload is a simple Web protocol that triggers events to the clients whenever files are modified.Ĭlients can handle this event in their own way, even if the most common use case is when a file is modified (or is a compiled version). Its syntax is consistent and easy to learn, and a lot of examples are available around the Web. Grunt offers a wide variety of plugins, ranging from watching files to linting, compiling, and minifying your code. We also used it to create a workaround for some performance issues we found in the Vagrant Rsync-auto watcher, which were recently introduced. TestFilepath = filepath.replace regex, "foo/bar/$1/Tests/$2Test" We use it, for example, to continuously test in PHP while we develop: terminal = require('color-terminal') Grunt’s scope goes beyond simply automating front-end related tasks. The best comes when you can combine tasks together to create even more powerful ones! Grunt is our preferred tool when it comes to task automation. It’s a JavaScript task runner, offering a lot of bundled plugins for common tasks, while still being very extensible, giving you the option to write all kinds of tasks to suit your need. I personally think that if they continue to follow this path, they will definitely become the ultimate IDE (or Integrated Developer Environment) for the web offering web developers a powerful development space bundled directly into the browser. If you’re curious enough (like us) you can learn a lot about how a browser (and indirectly, the web) is working, letting you take back full control of your application’s lifecycle. On top of all this, the network tools let you understand what is really going on under the hood and optimize your loading flows, all while the timeline gives you a deeper view of what the browser does. You can for example copy anything to your clipboard from the console by calling the special `copy` function and passing the thing to be copied (object, function return, etc.)Ī lot of great tutorials are also available on HTML5 Rocks. For example, the section about command-line API contains really useful commands. The official website and the Google Developers Youtube channel both are goldmines of information. The DOM/CSS editor is an extremely powerful tool, letting you provide real-time feedback to your team, iterating fast on the UI/UX of a new feature. We recently solved some render performance issues thanks to this. You can edit the DOM (HTML)/CSS in real-time, debug JavaScript step by step while undertaking a deep performance analysis, and even add a terminal. The dev tools are a complete suite of diverse instruments. Each release (every 6 weeks or so) comes with its own brand new dev tool features. Since its birth, Google Chrome has invested a lot in its developer tools and is still improving them continuously. The best tool we have in our hands today. ![]() In this blog post, we’ll present the 5 best tools and frameworks that we use every day to address these challenges. From test frameworks to profiling tools, we now have mature and useful tools to bring the best experience to our users.Īt Mention, we love the tools which help us to provide the best quality software while at the same time making our life easier. In order to succeed in these new challenges of complexity, developers have created a lot of tools to streamline the overall development process. ![]() Meanwhile, Javascript, the web language, has grown a lot (both in popularity and in maturity) and now has back-end side implementation with NodeJS. These apps have become much richer, leading to a huge increase in complexity on the front-end side.įrameworks like Backbone (the one we use at mention), AngularJS, and EmberJS provide robust solutions to build amazing apps, leveraging all of the web’s power. ![]() Over the last few years, we’ve seen tremendous growth in an entirely new generation of web applications. ![]()
0 Comments
Leave a Reply. |