Welcome to the nuBuilder Forums!

Register and log in to access exclusive forums and content available only to registered users.

[Coding] Tidy & Optimise your Code with a Code Beautifier/cleaner

Video Tutorials, How-Tos, Tips & Tricks, and Guides.
kev1n
nuBuilder Team
Posts: 4292
Joined: Sun Oct 14, 2018 6:43 pm
Has thanked: 71 times
Been thanked: 444 times
Contact:

[Coding] Tidy & Optimise your Code with a Code Beautifier/cleaner

Unread post by kev1n »

Proper formatting of code is important for several reasons:

Readability: Properly formatted code is easier to read and understand. When code is formatted consistently, it becomes easier to quickly scan and understand its structure. This makes it easier for developers to collaborate and maintain code over time.

Maintainability: Code that is properly formatted is easier to maintain. When code is well-structured, it is easier to make changes to it without introducing errors. This is especially important when working on large codebases where many developers are making changes.

Debugging: Properly formatted code is easier to debug. When code is formatted consistently, it is easier to identify and fix errors. This can save developers a significant amount of time when debugging complex problems.

Efficiency: Properly formatted code can be more efficient to write. When code is well-structured, it is easier to identify patterns and reuse code. This can lead to more efficient development practices, which can save time and reduce errors.

Conventions: Properly formatted code follows conventions. When code is well-formatted, it follows established conventions for formatting and structure. This makes it easier for other developers to understand and work with the code. It also makes it easier to adopt new tools and libraries that follow these conventions.


Tools

nuBuilder's advanced editor (ACE) includes a beautify option. More advanced tools can be found online.

For JavaScript, use an online tool such as JavaScript Cleaner - Free Online JS Beautifyer

This free online JavaScript code beautifier and cleaner tool allows you to tidy and optimize your code. Wheather it's an obfuscated, minimized or just a messy script, this program will help you bring it to a more readable format.

For PHP, use a tool lik PHP Beautifier

Beautify dirty, ugly PHP code using Online PHP Beautifier and make your PHP code more readable. It gives the PHP code proper indentation with spaces or tabs. It also supports various indentation styles such as K&R style, Allman style, Whitesmiths style and GNU style.


:arrow: An example of a function with bad formatting:

Code: Select all

function getWeather(city) 
{
const apiKey = "your_api_key_here";
	const apiUrl = `http://api.openweathermap.org/data/2.5/weather?q=${city}&APPID=${apiKey}`;

fetch(apiUrl)
.then(response => response.json())
.then(data => {
if (data.weather) 
{
const weatherDescription = data.weather[0].description;
const temperature = data.main.temp;
const humidity = data.main.humidity;
	const weatherInfo = `The weather in ${city} is currently ${weatherDescription}, with a temperature of ${temperature} Kelvin and a humidity of ${humidity}%.`;

alert(weatherInfo);
} else {
		alert(data.message);
}
})
.catch(error => {
alert("An error occurred while retrieving weather data.");
});
}

:arrow: With proper formatting

Code: Select all

function getWeather(city) {
    const apiKey = "your_api_key_here";
    const apiUrl = `http://api.openweathermap.org/data/2.5/weather?q=${city}&APPID=${apiKey}`;

    fetch(apiUrl)
        .then(response => response.json())
        .then(data => {
            if (data.weather) {
                const weatherDescription = data.weather[0].description;
                const temperature = data.main.temp;
                const humidity = data.main.humidity;
                const weatherInfo = `The weather in ${city} is currently ${weatherDescription}, with a temperature of ${temperature} Kelvin and a humidity of ${humidity}%.`;

                alert(weatherInfo);
            } else {
                alert(data.message);
            }
        })
        .catch(error => {
            alert("An error occurred while retrieving weather data.");
        });
}
Post Reply