Use this checklist as a guidebook to learn web development
HTML main tags Playlist
HTML5 Structural / Semantic elements
HTML Elements and their attributes
HTML Formatting
HTML Comments <!-- -->
Link
HTML forms Link
<link>
#ff0000
rgb(0,0,255)
red, pink, brown
script
Article
console.log
Article
typeof
operator Article
Object.keys
Article
Object.getOwnPropertyNames
Article
.hasOwnProperty
Article
this
keyword Video
constructor()
setTimeout
Video
alert
Article
document.getElementById
document.getElementsByTagName
document.getElementsByClassName
document.getElementsByName
document.querySelector
document.querySelectorAll
.createElement
.innerHTML
.innerText
.append()
.remove()
.appendChild
.style
events
.addEventListener
.removeEventListener
event.preventDefault
@keyframes
name
, duration
, timing-function
, delay
, iteration-count
, direction
bind
, call
, apply
Video
fetch
, axios
Video
UX designers use the following software for the designing. As a UI developer, you will get either the files of design or style guide. Do review them.
As a web developer, you should know that the designers use HEXA values of the color code. If you want to use RGBA (Red Green Blue Alpha) in your code then you need to ask the designers to provide that
As a web developer, you should know that designers use px
as default units while designing. If you are using em
or rem
, you need to discuss this with your designer and ask about the base font size. This base font size will help you to convert from px
to em/rem
As a web developer make sure that the designs have consistency in the size, colors, and UX. Eg: the font size and color of the headings on every page should be the same, the body's font size should be the same.
You should review the designs given by the designers to make sure the consistency is there.
If you have a big project ask your UX team to share the style guide. Style- guide is the information about the color palette, font size, heading style, etc. This becomes the base guidelines for developers and testers.
While working on the forms it is important to ask the designers about the error, success, or informative states design. Most of the time UX folks miss these states.
It is important to have the wireframes to understand the flow of the user's journey. Wireframes are like blueprint of the application.