Coding standards tell developers how they must write their code instead of each developer coding in their own preferred style, they will write all code to the standards outlined in the document. This makes sure that a large project is coded in a consistent style.
Coding style is made up of numerous small decisions based on the language:
There is always someone in your team who is arguing about tabs…
The Frontend Developer has the main responsibility of producing, maintaining, and supporting the business’s web-based software systems and platform. You have to take part in all aspects of software/site development cycles, all the way from the gathering of the necessary requirements for product code development and maintenance.
You have to lead the business’s web-based and software development efforts.
List of roles and responsibilities
User Interface: In the user interface, You have to work closely with the person who takes the responsibility of photoshop/sketch like a visual designer and UX designer. You have to play a leading role in the translation…
No, it’s not mandatory but it’s useful. As a frontend developer, I write code in HTML, CSS, Javascript etc but I have a passion also to loves making UIs look fantastic, and shitty design makes me sleep uneasy.
If the designer gives you all the assets (images, redline document etc) then it’s ok otherwise you have to collect the design assets from photoshop or sketch. That’s why you have to learn minimal photoshop and sketch.
From my experience, I have learned it’s not a good practice to disturb designer any silly issue like (need a transparent image, image optimization etc).
Flexbox (also know as flex) is a very powerful layout tool. It solves many layout problems that designers have been struggling to solve for a very long time. Flexbox provides more control to developers who want to build naturally responsive layouts.
There is no need to use tables, floats, clearfix or any other ‘hacks’, and it is easy to get started with. Flexbox is based on understanding a few concepts.
Let’s make a layout using flex
<nav class="container">
<div>Home</div>
<div>Search</div>
<div>Logout</div>
</nav>
give the…
Styled-Components is a CSS tool which helps you organize CSS in your React project. The styled components remove the mapping between components and styles. This means that when you’re defining your styles, you’re creating a standard React component.
By using styled components you can Build small and reusable components, Reducing the risk of specificity clash, a mapping between styles and components.
Let’s started with a simple styled component demo
Install the styled components library in your project
npm install styled-components --save
Create a component
import React, { Component } from 'react';
import styled from 'styled-components';
const Title = styled.h1`
color: red;
`;
class App extends Component {
render() {
return (
<Title>Hello world</Title>
);
}
}
export default App;
Check their official website for more details
https://www.styled-components.com/
Originally published at www.rajibkarmaker.me on January 21, 2018.
What is Webpack?
Webpack is a module bundler for modern JavaScript applications. It takes your code, transforms and bundles it, then returns a new ‘compiled’ version. It’s also known as module bundler. Webpack is not limited to be used on the frontend, but it’s also useful in backend Node.js development as well.
What can Webpack do for you
According to the docs, redux-saga is a library that aims to make application side effects (i.e. asynchronous things like data fetching and impure things like accessing the browser cache) easier to manage, more efficient to execute, simple to test, and better at handling failures.
Why You Should Use Redux Saga
Redux became the popular and standard for state management in ReactJS applications. Redux provides an interface for dispatching actions to reducers which leads to transitions between states that other components (or Sagas) may react to. Redux Saga is an approach to the organization of side effects. …
A little bit of discipline can help you load the application faster and interact faster with any device. Your application should load fast and be interactive as soon as possible. For this, you have to follow some rules. Let’s get started
Minify and combine JS files
Minifying JS files will remove unwanted characters (whitespace, tab etc.) and comments from the script. This will help compress the file making it smaller in size. The files will download comparatively faster as it is minified.
Avoid global variable Whenever you try to use a variable, JavaScript first searches that in the very immediate…
Git is a version control system for tracking changes in computer files and coordinating work on those files among multiple people. It is primarily used for source-code management in software development, but it can be used to keep track of changes in any set of files. wiki
As a developer one of the basic tools we can’t escape using is making use of git for our workflow.
git diff — Check the changes between two commits, two files.
git diff -w — In order to ignore differences caused by whitespaces when comparing lines, you can use it with the -w…
The term API stands for Application Programming Interface. An API works as a middleman, taking the request from one piece of software, and then replying with the appropriate response from the other. APIs work quietly in the background, making the interactivity we expect For example — Order a pizza, hotel booking, post on social media (facebook, twitter) etc..
Why good APIs are important?
An API is a set of routines, protocols, and tools for building software applications. API specifies how software components should interact. So your software all functionality depends on the API. If API down then your software functionality…
I love Technology and Like to Help Others with any knowledge that I have. My website — www.rajibkarmaker.me