UseRef hook can be used in two ways. First, it allows to directly access to DOM element, so we can manipulate it. Second, it can keep any mutable value in its .current property, that is not change between renders.
Read More React Hooks – useRef hook exampleReact Hooks – useEffect hook example
UseEffect hook runs after first render and after every other completed render (but we can change that, so it can runs after first render and only when certain values have changed). We may put in it piece of code, that runs after component render, so we can change state or manipulate DOM tree before it will display on screen).
Read More React Hooks – useEffect hook exampleReact Hooks – useContext hook example
UseContext hook provides a way to pass data through the component tree without having to pass props down manually at every level. It helps maintaining cleaner code. In other words – it provides a way to share values between components without having to explicitly pass a prop through every level of the tree.
Read More React Hooks – useContext hook exampleReact Hooks – useReducer hook example
UseReducer is an alternative to useState. It works better when you have complex state logic that involves multiple sub-values (e.g. if your state is multidimensional object) or when the next state depends on the previous one. UseReducer hook accepts a reducer of type (state, action) => newState
, and returns the current state paired with a dispatch
method:
React Hooks – useState hook example
Hooks are a new functionality of React, thanks to which we can “hook into” React features, which makes writing applications easier. First hook that I want to show you is called useState and it is a hook that allows you to use state in a functional component (before hooks you could not use states in functional components, which is why they were called stateless components. Now the name has been changed to functional components).
Read More React Hooks – useState hook exampleCSS text-decoration property and new styles 2019
New styles, tags, functionalities – this is what tiggers like best 🙂 In this post I will show you how to style text using the text-decoration tag and what new styles for lines (underlines, overlines) are available from 2019
Read More CSS text-decoration property and new styles 2019Styling chosen links on site, e.g only links to PDF file
In previous post: styling lists with pseudo-classes I described how to change the color of active, clicked or hovered links. Now I will show you how to change the style of selected links, e.g. only those that lead to PDF files.
Read More Styling chosen links on site, e.g only links to PDF fileStyling links with css
Standard appearance of hyperlinks on a website depends on the browser. Each browser can display links and their variants (with different pseudo-classes) in a different way.
Usually we want to set our own styles so to display links in the same way in any browser.
Links can have different states, and each of this states can be styled. This states are called pseudo-classes.
Read More Styling links with cssBasic git commands
You can perform git commands for example in:
– cmd console (widnows start -> cmd. It should oppened Command Prompt app. To go to the root directory, enter cd \ . Next enter cd + path to directory with your project, e.g. cd Users\ Joanna\Desktop\my-project
– git bash console, which you can get from https://git-scm.com/downloads . After installing console go to directory with your project, right click and select: Git Bash Here (then console opens).
If you have your console with path to your project, you can enter first command (step one).
Read More Basic git commandsRem, em – length units in CSS
I must admit that I rarely used such units of length as rem and em so far. I usually used pixels (px), because somehow it was easier for me to associate what size a given element will have.
The rem and em units, however, have one advantage over pixels – they can be set in correlation to parent font size (em) or root font size, which most often is <html> elemet (rem). This gives the ability to manipulate sizes for many elements at once. The default root font value is usually 16px (but it depends on the browser).
Read More Rem, em – length units in CSS