-
Notifications
You must be signed in to change notification settings - Fork 0
/
blogs.html
182 lines (181 loc) · 11.6 KB
/
blogs.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="shortcut icon" href="/images/download.ico" type="image/x-icon">
<script src="https://kit.fontawesome.com/aa04ad0668.js" crossorigin="anonymous"></script>
<title>Blogs | Ayush Raj</title>
<link rel="stylesheet" href="style.css">
</head>
<body>
<!-- Navigation -->
<nav class="navigation">
<div class="nav-brand">WEB DEVELOPER</div>
<ul class="unordered nav-pills">
<li class="inline-list link">
<a href="index.html">Home</a>
</li>
<li class="inline-list link">
<a href="project.html">Projects</a>
</li>
<li class="inline-list link">
<a href="blogs.html" class="link-active">Blogs</a>
</li>
</ul>
</nav>
<div class="grid-container">
<div class="blogs">
<img src="blogs/box_model.png" alt="seo-blog" class="blog-img">
<div class="blog-content">
<h2>CSS Box Model</h2>
<p>
In HTML,every element is contained in a box irrespective of their display either block or inline. And every box has its properties.So, CSS box model helps us to visualize the element box and margin, padding, border and content associated with it.
</p>
<p>
CSS box model is divided into 4 layers,let's go through each layer from inner-most to outer-most one by one. <strong>[C P B M]</strong>
</p>
<p><strong>Content (C): </strong>
It is the part of CSS box model that is defined with an HTML element,it may contain media files for text. It is the inner-most layer of CSS box model.
</p>
<p><strong>Padding (P): </strong>
This is the second layer of CSS box model. It describes how much space is between content and border. It's units are px, rem, vw, vh, em.
</p>
<p><strong>Border (B): </strong>
This is the third outer-most layer of CSS box model. It describes about the properties of border that is associated with the HTML element. It cover-ups padding and content in it. It's units are the same as padding.
</p>
<p><strong>Margin (M): </strong>
It is the outer-most layer of CSS box model. It describes the space between browser window and border and also between two elements. It's units are also the same as margin and padding.
</p>
</div>
</div>
<div class="blogs">
<img src="blogs/react-logo.webp" alt="box-model-blog" class="blog-img">
<div class="blog-content">
<h2>React JS</h2>
<p>
Many beginner developerswho are stressed out in the battle of reactor versus JavaScripthave this question in their minds "Why do I need to learn an additional framework when I can do everything with vanilla JS ?"
</p>
<p>
React is a JS library developed by Facebook which, among other things, was used to build Instagram. Its aim is to allow developers to easily create fast user interfaces for websites and applications alike. The main concept of react JS is virtual DOM.
</p>
<h3>Reasons to use React:</h3>
<ol>
<li>
Unlike your jazz, apps and react are not created as one long stretch of a file but a small building blocks called components Dad allows usto develop components without hampering other components.
</li>
<li>
React uses virtual DOM which is representation of real DOM kept in memory and synchronized with the real Domevery change happens in componentis updated on virtual DOM. Reults in making website faster.
</li>
<li>
With the help of React it becomes easier to develop complex web apps as it changes only the necessary elements of the real DOM rather than re-erndering everything.
</li>
<li>
It's easier to maintain components of react as we can update any component anytime and track its behaviour on different viewports, and then repeat the process ith other components.
</li>
<li>
React manipulates the DOM to change only those components which are required to be changed and with the help of <em>React Router</em> navigates the website from one path to another without reloading.
</li>
</ol>
</div>
</div>
<div class="blogs">
<img src="blogs/What-is-cryptocurrency.jpg" alt="crypto-blog" class="blog-img">
<div class="blog-content">
<h2>Crytpocurrency</h2>
<p>
You have heard it from someone that he is investing in cryptocurrencies or planning to do so. So you wondered what is cryptocurrency and what is the rush about it?
</p>
<p>
It is a digital currency, which is an alternative form of payment created using encryption algorithms. The use of encryption technologies means that cryptocurrencies function both as a currency and as a virtual accounting system.
</p>
<p>
By spreading its operations across a network of computers, blockchain allows Bitcoin and other cryptocurrencies to operate without the need for a central authority. This not only reduces the rish but also eliminates many of the processing and transaction fees.
</p>
<p>
There are now more than 12,000 cryptocurrencies, and what's truly astonishing is the growth rate. The number of cryptocurrencies more than doubled from 2021 to 2022. At the end of 2021, the market was adding about 1000 new cryptocurrencies every month.
</p>
<p>
Some of the trending cryptocurrencies and prices are listed below:
</p>
<ul>
<li>
<strong>Bitcoin (BTC): </strong> 18,730.2 USD
</li>
<li>
<strong>Ethereum (ETH): </strong> 1290.33 USD
</li>
<li>
<strong>Tether (USDT): </strong> 1 USD
</li>
<li>
<strong>BNB (BNB): </strong> 269.72 USD
</li>
<li>
<strong>Solana (SOL): </strong> 0.26 USD
</li>
</ul>
</div>
</div>
<div class="blogs">
<img src="blogs/maxresdefault.jpg" alt="seo-blog" class="blog-img">
<div class="blog-content">
<h2>Quantum Computing</h2>
<p>
Next remarkable technology trend is quantum computing, which is a form of computing that takes advantage of quantum phenomena like superposition and quantum entanglement. This amazing technology trend is also involved in preventing the spread of the coronavirus, and to develop potential vaccines, thanks to its ability to easily query, monitor, analyze and act on data, regardless of the source. Another field where quantum computing is finding applications is banking and finance, to manage credit risk, for high-frequency trading and fraud detection.
</p>
<p>
Quantum computers are now a multitude times faster than regular computers and huge brands like Splunk, Honeywell, Microsoft, AWS, Google and many others are now involved in making innovations in the field of Quantum Computing. The revenues for the global quantum computing market are projected to surpass $2.5 billion by 2029. And to make a mark in this new trending technology, you need to have experience with quantum mechanics, linear algebra, probability, information theory, and machine learning.
</p>
</div>
</div>
<div class="blogs">
<img src="blogs/1_vJQobI4oS3MmpTWqerBcKw.png" alt="seo-blog" class="blog-img">
<div class="blog-content">
<h2>Tailwind CSS</h2>
<p>
When coding an application from scratch, you want it to reflect your unique brand, be responsive on any device, and be easy to write and maintain- And those are probably just a few items on your wish list. By building with Kelvin CSS you cancheck these items off your list.
</p>
<p>
Tailwind CSS is a utility-first Framework designed to enable usersto create applications faster and easier. You can use utility classes to control the layout, color, spacing, typography, shadows, and many more to create a completely custom component design- without leaving your HTML or writing a single line of custom CSS.
</p>
<p>
Tailwind CSSis a low-level framework. Meaning, unlike other CSS frameworks like bootstrap and materialize, Tailwind does not offer fully styled components like buttons, drop downs, and navbars. Instead, it offers utility classes so you can create your own reusable components. So it provides a more flexibility and control over what your application looks like then other CSS framework. This can enable you to create a more unique site.
</p>
</div>
</div>
<div class="blogs">
<img src="blogs/SEO.jpg" alt="seo-blog" class="blog-img">
<div class="blog-content">
<h2>Search Engine Optimization (SEO)</h2>
<p>
Come to think of it we are browsing a bunch of websites everyday have you ever wondered how they are listed on the top of search engine results, you may think that it's because we use our devices that were signed in with our accounts so they actually guesses what we are looking for from our recent search history.You may be halfway correct but what about the search that is going to be the first time and it is listed on the top of the search engine results?
</p>
<p>
Well the easy answer to that question is , these websites that are listed on the top of search engines use SEO ( search engine optimization).</p>
<p>
SEO refers to techniques that help your website to rank higher in organic search results.
So that it becomes easier for the people who are looking up for our product or services via search engine.
The ultimate goal of SEO is to attract the customer who are looking for the products or services that we offer.
Handling SEO carelessly leads to missing out thousands of opportunities and creates a major loss in our business.
It helps customer to find out what actually they are looking for. Practicing SEO basics, as well as more advanced techniques after those, we can drastically improve our website's ability to rank in the search engine and get found by your potential customers.\
SEO is the most viable and cost effective way to both understand and reach customers in key moments that matter.
In development of a website meta tags were used to optimize search engine optimization. They provide brief data in keywords about our website to the search engines and website visitors.
In other words, they make it easier for search engines to determine what your content is about, and thus are vital for SEO.
</p>
</div>
</div>
</div>
<footer class="footer container">
<div class="footer-header">
Connect with me on social media
</div>
<ul class="social-links">
<li class="inline-list"> <a href="https://github.com/Ayush-1315" class="link social" target="_blank"><i class="fa-brands fa-github"></i></a> </li>
<li class="inline-list"> <a href="https://www.linkedin.com/in/ayush-r-1a9095119/" class="link social" target="_blank"><i class="fa-brands fa-linkedin"></i></a> </li>
<li class="inline-list"> <a href="https://www.instagram.com/ayush1308rj/" class="link social" target="_blank"><i class="fa-brands fa-instagram"></i></a> </li>
</ul>
</footer>
</body>
</html>