DEV Community: Shani Sharma

Learn CSS by creating Netflix Logo

Shani Sharma — Fri, 20 Jan 2023 02:25:56 +0000

Learning CSS by creating projects is the best way of leaning any language. This article will teach you some topics of CSS by creating Netflix logo.

Now create file called index.html and style.css. In the index.html file create the start template :

<!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">
<title>Netflix Logo</title>
<link rel="stylesheet" href="style.css">
</head>
<body>
</body>
</html>

In style.css file create the starter style:

body{
padding: 0;
margin: 0;
height: 100vh;
display: flex;
justify-content: center;
align-items: center;
background-color: azure;
}

In index.html file add the add a

tag having class name “netflix-log” like below:

Now add the following styles to style.css file:

.netflix-logo {
height: 15rem;
width: 3rem;
border-left: 3rem solid #e50914;
border-right: 3rem solid #e50914;
}

Add the following code to your style.css file:

.netflix-logo:before {
  display: block;
  content: '';
  width: 100%;
  height: 100%;
  background: #e50914;
}

Add this style to the existing .netflix-logo:before:

transform: skewX(21.5deg);

Add this final line to your .netflix-logo:before class in your style.css file:

box-shadow: 0 0 30px black;

If you view your index.html file in a browser. you should see the completed Netflix Logo:

Let’s connect:

You can get the source code from here. And also for detailed article you can visit here

Important tips to learn PHP

Shani Sharma — Mon, 16 Jan 2023 18:44:25 +0000

Before leaning PHP it is better to plan the journey or craft the the learning procedure. Because many Professional PHP developers had recommended that to plan the process of the leaning path is the best method to start leaning of PHP.

A research conducted by Harvard and MIT found that only 4% of students who enroll in online courses completes them and the rest of them lefts the classes in the middle.

So how can I help you avoid becoming another of the 96% of people who give up?

I have compiled the list of 10 pointers in that pointer I have clearly mentioned that how you can start learning PHP effectively, keep motivated and also avoid some potential pitfalls.

So to know the points you can reach out to our blogpost
https://codingsutra.in/important-10-tips-to-learn-php/ to know more.

Thank you may this will help you in your journey.

Best JavaScript Data Grid Libraries

Shani Sharma — Sun, 15 Jan 2023 07:09:35 +0000

Using various libraries, you can deploy all your data in tabular form and take the next step in web development.

JavaScript is the basic structure of many web applications. It comes in handy for development needs, saving unnecessary effort and time for development and testing.

It also keeps everything under one roof so you can easily access important features and implement them in your app.

What is a JavaScript library?

JavaScript is a well-known programming language that is one of the basic technologies of the World Wide Web. Almost all browsers have a dedicated JavaScript engine that runs code on multiple devices.

Since it is used all over the world for web application development, you will find some pre-written code here to allow developers to easily create web applications. And this collection of pre-written JavaScript code is known as a JavaScript library.

Below is the list of Data Grid Libraries in JavaScript

FusionGrid
Handsonable
Kendo UI
Griddle
AG grid
TanStack table
DevExtreme
FlexGrid
Ignite UI

If you want learn more about this Data Grids then you can click this.