May 6, 2021
Must know before professional web development
In this article we will know some basic things that are important to know before doing production level web development. In addition to writing programs, you need to know some basic things for professional web development. These are
Coding Style
Coding style is most important to develop a professional web application and also for a company. If you are an employ of a web development company you must follow there coding styling instructions or follow a standard style. Otherwise, it is difficult to read by other developers. In future it’s very heard to add new feature if your coding style is not proper.
some syntax show below
Above these, you should put semicolon after a statement.
A single line conditional statement like if(condition) doSomeThing() never give curly bracket(Ex-1). Without curly bracket never split statement.(Ex-2)
example:
- if(condition) { doSomeThing() } //wrong
if(condition) doSomeThing() //right
2. if(condition)
doSomeThing() // wrong
if(condition) {
doSomeThing() //right
}
Comments
Comment is a very common think in coding world. For more understandable code, we write comment beside or top of the code. But if we not follow any standard rolls of writing comment, it can make our code dirty. So we should follow any standard roll or if you get job any company you should follow there rolls. We know in JavaScript we write comment in two ways. 1. one line (//something) , 2. Multiline(/* something*/).
some rolls I discus with you:
- We should avoid comment writing in code. because it take extra space and show extra text, it’s look like dirty. We should make separate function for separate work and also give function name similar with work, it’s very useful for production level development. In future it will very easer to update or add new features. Developer easily understand what is doing this function.
- If your code is very difficult to understand for other developer, then you should write comment beside to line or top of this code.
Error Handling
Error handling is most important thing about web development. When you developed a professional web application for your client or company you must handle error of your code. Otherwise it can’t become user friendly. For handle any error we mainly use try-catch method.
let’s learn about try-catch briefly.
Syntax:
try {
//code
} catch(error) {
//error
}
- At first try {…} is executed. If there is no error in code then catch(error) is ignored.
- If catch any error in code then stop execute try and skip it and execute catch(error) and generate error output.
When find any error ,it generate an error object. This object has two part name and message. Name is error title and message is error details.
try-catch execute synchronously. If an exception happens in “scheduled” code, like in setTimeout(), then try-catch won’t catch it(Ex-1). Cause It run only one time. But if you declare try-catch inside setTimeout() it will execute(Ex-2).
example
- try {
setTimeout(something(), 1000)
} catch(error) {
console.log(error)
} // dose not work
2. setTimeout(() => {
try {
//code…..
} catch(error) {
console.log(error)
}
}, 1000) // work
the main important thing is try-catch only give you runtime error. If your code syntax or fundamentals error find, it don’t show any error.
Cross Browser Testing
For develop professional web application, as a developer you must need to test cross browser. Couse as a developer you should think about your developed application users. How they visit this application, which browser they use. It’s very normal that everyone do not use same browser. As a result as a developer you should test cross browser to confirm that, your application looking good and user friendly in most of browser that user use.
It’s impossible to test in all browser. The application should work entirely in the last few versions of the most popular desktop and mobile (iOS, Android, Windows phone) browsers — this should include Chrome (and Opera as it is based on the same rendering engine as Chrome), Firefox, IE/Edge, and Safari. It should also provide an acceptable experience on IE 8 and 9, and be accessible with WCAG AA compliance.
why we need cross browser test?
- Sometime browser have bugs and engineers implement features differently. Though now a day browsers maintain a standard but sometime difference and bug occurs.
- some browsers may have different levels of support for technology features than others.
example: look at the image
As well as many JavaScript code are execute different way in different browser. So, before launch your project, you must need cross browser testing.
Balancing client and server caching
What is Caching? When user make same request many time to the server this common requested result store locally for certain time, It’s call caching. So that if user again request for this data, then application show data without fetch from database. As a result the application work first and get data for user immediately.
In client side and server side you can store cache store.
Client cache
If you include cache store in client side, when user send any request, it first go to cache and try to match with stored data, if any data match with request then return data in user display and the request do not pass to server. For that, application work firster and give user friendly performance.
Server cache
If server side has cache store, it store most requested data in locally. It also work same process. If user again request for any data, then server try to match request URL, if matched any URL then give the result from cache, otherwise it fetch data from database. As a result application run first and user friendly.
Sometime cache data slow to change. Especially if you leverage a data delivery network. It has some privacy issue also. To fixed privacy issue it take few time to propagate.
It’s very important to balance caching between client and server to develop a firster application.
Bonus
JavaScript values
it’s important to learn as a JavaScript developer that, in JavaScript there are 2 types of value.
- Primitive Values
- Objects and Functions
Primitive value
Number and String are the primitive value in JavaScript.
example :
console.log(“Hello”) // string
console.log(2) // number
Objects and Functions
Other value are objects or functions.
console.log([]) //object
console.log({}) //object
console.log(x => x*2) //function
