avatar

Gagandeep Singh

Docker - useful commands

To run a container using an image 🔗docker run <image name> example: docker run hello-world Override the default command for a container 🔗docker run <image name> command example: docker run busybox ls Show running containers 🔗docker ps docker ps --all This will list all the containers that were ever created on your machine. Restart stopped containers 🔗docker start <container id> example: run docker ps –all to get the list of containers

Using useState hook with the previous state

Let’s take a very basic use case of the useState() hook; updating the count variable on each click. The code look perfectly fine and will work as expected in almost every time. BUT the issue with this code is that setCount() doesn’t guarantee that the previous count that it’s going to use to either increment and decrement to get the next state will be the latest one. To make sure that we always use the latest previous state for calculating the new state, we need to pass a callback function in the setCount rather than directly doing computation inside it.

Browser storage (overview)

Storing data on the machine of the user Data is available to the user on that particular machine and hence cannot be shared with anyone else Example: Storing data such as items in my shopping cart or recently viewed products Different types of browser storage options available are: Local storage / Session storage Cookies IndexedDB Local Storage /Session Storage 🔗 key-value pairs to store data data can read/write from/to local or session storage only via javascript or user better for storing simple values and not for storing complex values Cookies 🔗 simple key-value pairs with some configuration options can be cleared by using javascript or by the user data in the cookies is send to the server (they are attached to the headers of the http request) not good for complex data IndexedDB 🔗 client side database can be used with a query language good for storing complex data on client side can be cleared by user or javascript

ES7 features you should be using

Array includes() method 🔗The old way to check if some value is present inside an array was to use Array’s indexOf() method. IndexOf() returned -1 if element is not found or else the position of element if it’s present in the array. Exponential operator 🔗Similar to Math.pow(), the exponential operator ** was introduced in ES2016. It returns the first argument raised to the power of second argument.

Container vs Presentational Components in ReactJS

Presentational/Functional/Stateless Components 🔗Functional components in ReactJS is a simpler way of creating components. Some of the key features of functional components are: It is best suitable for components which only consists of a render method They are also called stateless components since they don’t have an internal state and just make use of props to display the data It is not a class which extends React.Component It is just a function which accepts props and returns the rendered component You can define propTypes and defaultProps on the function let helloComponent = (props) => { return( {props.