LiveReload and Auto-save simultaneously in Sublime Text 3

Every front end developer must have encountered the problem that every time the web code is updated in the editor they have to refresh the browser each and every time. It becomes a hectic when the code is updated very often and the result is observed in parallel.
So, here's the solution for this problem. This tutorial is for Sublime Text 3 Editor. The solution is to install the LiveReload plugin in Sublime Text 3 and its extension in the browser.
Refer for tutorial on installing LiveReload.

While writing the website code in Sublime Text 3, it lacks for Auto-Saving the code. Repeatedly saving of code lead to less efficiency of the web coder. To over come this a plugin named Auto-Save can  be installed.

Refer for tutorial on installing Auto-Save.

Now as you have installed Auto-Save and LiveReload  plug-in, so whenever auto-save triggered to save the file the change can be seen Live in the browser.


I am an under graduate final year student pursuing B.Tech in Electrical and Electronics Engineering. I am interested and working in the field of Automation and Robotics. Being an Electrical and Electronics Engg. I have knowledge about Electrical as well as Electronics, but I have not restricted myself to these domains only, I have gained knowledge about Computer Science domain also. I am continuously learning and making vast my knowledge and skill set. I have learned MATLAB, EagleCAD, AutoCad Electrical, PLC, Arduino, Programming (C, C++, Python), Markup languages i.e, Front End Web Designing ( HTML, CSS, JavaScript ), Back-end( SQL, PHP ).

Comments

Post a Comment

Popular posts from this blog

How to disable VLC Media Player Flashing Pop-Up track notification on Taskbar

Image
Sometimes it becomes hectic when the next video in a playlist is playing in the backgroung and VLC media player is flashing pop up track notification on the Taskar. This can be disabled as follows: Go to  Tools -> Preferences   (set Show Settings to All at bootom left corner) The similar dialog box will appear. Now go to Main interfaces -> Qt Choose "Never" in the drop down menu named Show notification popup on track change. Press Save to save VLC settings and restart VLC after that to make sure changes are enabled.
Read more

Color Picker in Sublime Text 3

Image
While developing the web page, everyone must have faced the problem in finding the color code during testing that which color is suitable. It is hard to change and guess the color code value. To solve this problem there is a plugin named Color Picker in Sublime Text 3 which makes possible to chose color based on hex value, RGB value, HSL value or directly using the color picker. Follow these to install color picker : Sublime Text 3 >> Preferences >> Package Control >> Install Package >> ColorPicker Now search for ColorPicker and click on it to install. Once the Color Picker has been installed then it can be launched using the shortcut command Ctrl+Shift+C . If not launching then try to restart the Sublime Text 3. ( Color Picker Interface )
Read more

Emmet in Sublime Text 3

Image
Emmet is a very useful plugin to boost the productivity and save time. It helps in development of product with more efficiency. In Sublime Text 3 Emmet auto completes the syntax for web design languages like HTML and CSS. To install Emmet follow this :   Sublime Text 3 >> Preferences >> Package Control >> Install Package >> Emmet. Syntax for Emmet : Child: > nav>ul>li <nav> <ul> <li></li> </ul> </nav> Sibling: + div+p+bq <div></div> <p></p> <blockquote></blockquote> Climb-up: ^ div+div>p>span+em^bq <div></div> <div> <p><span></span><em></em></p> <blo
Read more