Search This Blog

Harshit's Blog

In this blog, I will be sharing my learnings about various tools and technologies that I got a chance to work with along with other experiences and tips that I believe are worth sharing.

Home
Contact Me

More…

Contact Me

Get link
Facebook
X
Pinterest
Email
Other Apps

Get link
Facebook
X
Pinterest
Email
Other Apps

Comments

What are Bootstrap breakpoints?

As I mentioned in the previous post What is a Responsive Web page? , breakpoints play a very important role in making a webpage responsive. So, let's now try to understand breakpoints and see them in action. X-Small: Portrait phones (less than 576 px) Small: Landscape phones (576 px and up) Medium: Tablets (768 px and up) Large: Desktops (992 px and up) Extra Large: Large Desktops (1200 px and up) Extra Extra Large: Larger Desktops (1400 px and up) By default, these are the categories into which all screen sizes are classified. Bootstrap provides different classes for these categories- sm , md , lg , xl , and xxl . These are called responsive classes. Let's say we use lg with some other Bootstrap class "A" what it would mean is that particular class "A" will get applied for all the screen sizes >= 992px. Also, suppose we want to apply the "A" class for the 'Large' category but a different class "B" for the 'Extra Large...

What is Bootstrap Grid System?

I don't want to go through every single detail of what Bootstrap Grid System can do because there is a lot and as I mentioned in the last part of What is Bootstrap? Why use it? the best way to know a tech in detail is to go through their documentation again and again. However, I do want to share some fundamentals to get a working knowledge of the Grid System. Bootstrap Grid System assumes 12 equal divisions of any screen. So, whatever device you have been using be it a mobile phone, tablet, laptop, or desktop. The total screen width has been split into 12 equal parts. Now, out of these 12 divisions, any number of divisions ranging from 1-12 can be applied to different HTML elements. The higher the number, the more width that particular element takes on the screen. Let's write this simple piece of code:- < div class = "row mt-4 text-center" > < div class = "col-12 border bg-info py-4" > ...

What to learn in Angular?

Angular has a lot of built-in stuff. This largely broadens the scope of things it can do without having to use too many additional libraries but at the same time, it brings a lot to be learned to get working with them. This post is just a high-level overview of what all Angular offers in general and their short descriptions in very layman's terms. Angular CLI This is not something that is taught typically but hardly anyone uses Angular without using its CLI so it was worth mentioning. So, Angular CLI is just a tool to develop and manage Angular applications through commands. This is important because Angular projects have a lot of files in them and the folder structure can really be overwhelming if tried to be managed manually. Components Components are sort of the fundamental building blocks for an Angular application. As the name suggests, these are the individual pieces or sections that together form the UI. Templates Templates are the HTML part of the component. Interpolation- ...