DEV Community: Iqra Firdose

The Ultimate Beginner's Guide to Using Color in CSS

Iqra Firdose — Thu, 02 Jan 2025 19:17:50 +0000

In the world of web design, color plays a crucial role in creating visually appealing and user-friendly websites. Understanding how to effectively use color in CSS (Cascading Style Sheets) can enhance the aesthetic quality of your site and improve user experience. This blog will explore various methods to specify colors in CSS, including hexadecimal, RGB, RGBA, HSL, and HSLA values. We will also discuss the importance of color contrast and accessibility, as well as techniques for creating gradients. By the end of this guide, you will have a solid foundation in using color in your web projects.

Using colors in CSS
The following methods can specify colors in CSS:

Hexadecimal Colors
RGB colors
Predefined/Cross-browser color names
RGBA colors
HSL colors
HSLA colors

Hexadecimal Colors

A hexadecimal color is specified with #RRGGBB, where the RR (Red), GG(Green), and BB(Blue) hexadecimal integers specify the components of the color.
The hexadecimal range is 0 to F which means 00 to FF.
For example, the #0000ff value is rendered as blue because the red and blue are set as 00 and the blue component is set as the highest value(ff).

RGB Colors

An RGB color value is specified with the rgb() function, which has the following syntax rgb(red, green, blue).
Each parameter (red, green, and blue) defines the intensity of the color and can be an integer between 0 and 255 or we can use a percentage value from 0 % to 100 %.
For example, the rgb(0,0,255) value is rendered as blue because the red and green are set to the lowest parameter (0) and the blue parameter is set to its highest value(255).

RGBA Colors

RGBA includes an additional alpha channel for transparency.
The alpha component specifies the level of transparency for a color. The alpha value is between 0 (completely transparent) and 1 (completely opaque).

0: Fully transparent, making the color invisible.

0.5: Semi-transparent, providing a partially see-through effect.

1: Fully opaque, indicating no transparency.

Predefined/Cross-browser Color Names

They are the normal names like White, black, pink, etc.
140 color names are predefined in the HTML and CSS color specifications.

HSL Colors

HSL stands for hue, saturation, and lightness. HSL is specified with the HSL() function, which has the following syntax HSL(120, 100%, 50%).
Hue (0 - 360): Represents the type of color. It's a degree on the color wheel, with red at 0, green at 120, and blue at 240.
Saturation (0% - 100%): Describes the intensity of the color. 0% is grayscale, and 100% is fully saturated.
Lightness (0% - 100%): Specifies the brightness of the color. 0% is black, 100% is white, and 50% is normal.

HSLA Colors

HSLA includes an additional alpha channel for transparency.
The alpha component specifies the level of transparency for a color. The alpha value is between 0 (completely transparent) and 1 (completely opaque).

<h1>HEX Color</h1>
<h2>RGB Color</h2>
<h3>RGBA Color</h3>
<p class="pre">Predefined Color</p>
<p class="hsl">HSL Color</p>
<p class="hsla">HSLA Color</p>

h1 {
  color: #ff5733; /* hex code for an orange color */
}
h2 {
  color: rgb(255, 87, 51); /*RGB code for the same orange color */
}
h3 {
    color: rgba(255, 87, 51, 0.7); /* RGBA code with 70% opacity */
}
.pre {
  color: red; /* color name */
}
.hsl {
  color: hsl(120, 100%, 50%); /* HSL code */
}
.hsla {
  color: hsla(240,100%,50%,0.3); /* /* HSL code with 30% lightness */
}

Opacity

In CSS, the opacity property is used to set the transparency of an element. It takes a value between 0 and 1.
0: The element is fully transparent (completely invisible).
1: The element is fully opaque (completely visible).

<img src="thecodedose.jpeg"alt="thecodedose" />

img {
  opacity: 0.5;
}
img:hover {
  opacity: 1;
}

Before:

After- hover on the image:

Color Contrast and Accessibility:

Color contrast is one of those important guidelines that ensure that people who cannot see certain colors or who do not see colors at all can normally use any website.

Accessibility or to be precise web content accessibility guidelines in short (WCAG) is a set of guidelines put forward by W3C or the World Wide Web Consortium which develops web standards such as HTML, CSS, etc these guidelines help make the web accessible to people with disabilities.

we have to make sure to use proper color contrast for which WCAG has set some minimum ratios as criteria to pass the web accessibility guidelines. We have a lot of categories like WCAG AA, AAA, Interface components, and many more.

Calulate Color Contrast

color contrast is calculated using relative luminance. It is defined as the relative brightness of any point in color space normalized to zero for the darkest black and one for the lightest white.
So, in simple terms as you can see here the darkest black which is nothing but the hex code #000000 has a relative luminance of 0 which goes up to 1 for the brightest white which is hex code #ffffff and this pretty much applies to any color on the color wheel if you take an example of red and sample out colors from this the relative luminance values are gonna look something like this which again starts from zero and ends at one.

To calculate relative luminance value involves a lot of math but here is a tool called contrast ratio Contrast Ratio, where you can just enter in the hex code and it'll tell you the relative luminance value So, now that we have the relative luminance all we have to do is apply the color contrast formula.

Color Contrast Formula= (L1 + 0.05)/( L2 + 0.05)
where ,
L1 is the luminance of the lighter color
L2 is the luminance of the darker color.

Example

A blue text on a white background.

Here white is a lighter color with a luminance of 1.
Blue is a darker color with a luminance of 0.0722.
Luminance is calculated using the tool, Contrast Ratio.

Now applying these values to the formula,

Color Contrast Formula= (L1 + 0.05)/( L2 + 0.05)
= (1 + 0.05)/( 0.0722 + 0.05)
= 8.59 = 8.59 : 1

you can check our color contrast, to know if it passes the WCAG Guidelines or not.
The tool to check this is the Contrast Checker.
you can also use Browser extensions like "Color Contrast Analyzer" which can provide real-time feedback on the contrast of elements on a webpage.

The blue text on a white background color passes the text as you can see below.

Readability: Sufficient color contrast is crucial for ensuring text and visual elements are easily readable.
Accessibility: Web content should be designed to be inclusive and accessible to users with various abilities. High color contrast enhances the overall accessibility of a website or application, making it usable for a wider audience.

Gradients

CSS gradients let you display a smooth transition between two or more specified colors.

CSS defines types of gradients.

Linear Gradient (goes down/up/left/right/diagonally)
Radial Gradient (defined by their center)

Linear Gradient

To create a linear gradient you must define at least two color stops. Color stops are the colors we want to render smooth transitions among. You can also set a starting point and a direction(or an angle) along with the gradient effect.
Syntax

background-image:linear-gradient(direction, color-stop1, colorstop2,...);

Directions Default direction: Top to Bottom

<h1>Linear gradient without direction</h1>

h1 {
  background-image: linear-gradient(blueviolet, black);
  color: white;
}

Specific direction: to right, to top, to bottom, to left, and to top left

<h2>Linear gradient with right direction</h2>

h2 {
  color: white;
  background-image: linear-gradient(to right, blueviolet, black);
}

Using angles :

<h3>Linear gradient using degree</h3>

h3 {
  color: white;
  background-image: linear-gradient(45deg, blueviolet, black);
}

Using transparency : To add transparency, use the rgba() function, in which the last parameter is transparency, and the range is 0(full transparency) to 1 (no transparency)

<h4>Linear gradient using transparency</h4>

h4 {
    color: yellow;
  background-image: linear-gradient(to right,rgba(255, 0, 0, 0),rgb(166, 0, 255));
}

Radial Gradient

A radial gradient is defined by it's center. To create a radial gradient you must define at least two color stops.

Syntax

background-image:radialr-gradient(shape size at position,start-color,..,last-color);

Example

<h1>Radial gradient</h1> 
  <h2>Radial gradient with degree</h2>

h1 {
  background-image: radial-gradient(blueviolet, black);
  color: white;
  width: 200px;
  height: 150px;
}
h2 {
  background-image: radial-gradient(white 20%, black 30%, blueviolet 50%);
  color: white;
  width: 200px;
  height: 150px;
}

<h3 id="rg">Radial gradient using shape-ellipse</h3>
<h4 id="rgc">Radial gradient using shape-circle</h4>

#rg {
    background-image: radial-gradient(ellipse, blueviolet, black);
  color: white;
  width: 200px;
  height: 150px;
}
#rgc {
  background-image: radial-gradient(circle, blueviolet, black);
  color: white;
  width: 200px;
  height: 150px;
}

Tools and Resources

Color Palette Generators:

Coolors

Coolors is a color scheme generator that allows you to explore, create, and customize color palettes. You can lock specific colors and generate complementary palettes.

Adobe Color Wheel

Adobe Color Wheel Color Wheel lets you create color schemes based on color rules such as analogous, monochromatic, triad, etc. It's a powerful tool for designing harmonious color palettes.

Browser Developer tool: Google Chrome Developer Tools: Right-click on an element, select "Inspect," go to the "Styles" panel, and hover over color values to pick colors. The color picker allows you to test and modify colors in real-time.

Conclusion
Mastering color in CSS is essential for any web designer or developer. By utilizing different color specifications and understanding the significance of color contrast for accessibility, you can create more engaging and inclusive websites. Remember that color not only beautifies your design but also affects usability and user experience. With the tools and resources provided in this blog, you are now equipped to experiment with colors confidently and enhance your web projects.

Thanks for reading the blog and investing your time . I hope you find this blog insightful and you learn something out of this. If you did, then shower some support by giving a reaction to the blog.

A Beginner’s Guide to Computer Networks and the OSI Model

Iqra Firdose — Fri, 20 Dec 2024 06:13:01 +0000

Learn how computer networks connect devices and let us share information and work together easily.

Introduction

Have you ever wondered how your WhatsApp message reaches your friend within seconds, or how streaming services like Netflix deliver high-quality video to millions of users simultaneously? The answer lies in Computer Networks.

A computer network is a set of interconnected devices that share resources and data using specific communication protocols. This blog will take you through the basics of computer networks, from their origins to the technical layers that make it all possible.

Networks

A network is a collection of devices connected through communication media to share resources or data.
For example, your home Wi-Fi network connects your phone, laptop, and smart TV to the internet. This process of sharing is often referred to as data communication.

How Did It Start?

The concept of networking began during the Cold War when the United States and Russia were in a technological race. Russia launched the first satellite, pushing the United States to innovate further. This led to the creation of ARPA (Advanced Research Projects Agency), which developed ARPANET, the precursor to the internet.

Initially, ARPANET connected four locations: UCLA, the Stanford Research Institute, UC Santa Barbara, and the University of Utah. It used TCP (Transmission Control Protocol) for communication.

As more computers joined ARPANET, the need for better organization arise, leading to the invention of the World Wide Web.

WWW (World Wide Web)

The World Wide Web (WWW), developed by Tim Berners-Lee, revolutionized the way information was stored and accessed. It allowed users to reference other documents via hyperlinks. The world's first website was a simple text-based page without any search engine functionality. Today, the web enables everything from social media to online shopping

Protocols

Communication in networks relies on a set of rules called protocols. Without them, devices running different software wouldn’t be able to exchange data. Protocols are defined by the Internet Society. Anyone can able to suggest about the internet by RFC(Request for comments).

There are some protocols

TCP(Transmission Control Protocol)
It will ensure the data reaches to destination and is not corrupted.

UDP
When you do not want to care about your 100% of your data is reaching or not. Ex: Video conferencing

HTTP
HTTP, or Hypertext Transfer Protocol, is the foundation of how web browsers and servers communicate to share information on the internet.

OSI(Open System Interconnection) Model

The OSI model illustrates how computers communicate in a structured manner across seven layers. Let’s break them down:

Application Layer

The application layer allows the users to access the network. It provides a user interface. It's implemented in software. Users interact with the application layer like browsers, messages, etc.

Design issues of the Application Layer

Client-server paradigm
All the application layer programs are based on the client and server.
A user at a local site wants to receive a service from a computer of a remote site.
Ex: A user wants to retrieve a file from remote computers both computers run the programs.
The local computer runs a program(client) that requests service from another remote program computer(server).

Addressing
Addressing is different based on mechanisms.
Client-servers communicate with each other using addressing.
Each application has its own address format.
Ex: The application program user uses an alias name instead of an IP address to make the environment convenient for the user by using DNS.
DNS is a Domain Name System, DNS maps names to IP addresses of that particular name.

Different services
The Application Layer is designed to give different services to he user or user programs.
The common service of the Application layer is SMTP, FTP, and HTTP.

Presentation Layer

We get the data from an application layer, the data is in the form of words or characters. The presentation converts it into a machine-readable format.
The presentation layer is concerned with the syntax and semantics of the information exchange between two systems.
The presentation layer acts as a Data translator and it performs encoding and decoding and it compresses the data.
Functions of the presentation layer

Translation
Encryption -Protecting the data
Compression-Reducing the size of the data, in order to reduce the load on the network.

Session Layer

It helps in setting and managing the connections and it enables sending and receiving of data followed by the termination of the connected session.
It is used to establish, maintain and synchronize the interaction between the communicating devices.

Functions of Session Layer

Dialogue control
Synchronization

Transport Layer

It is responsible for the process to process delivery.

Design issues of the Transport layer

Packetizing
Data received from the session layer is divided into small data units called segments. Every segment contains the port number of the source and destination and sequence number(Resemble the segments in the correct order). Dividing data into smaller units (segments) for efficient transmission is known as packetizing.

Connection control
Transport layer protocols are divided into two categories:

Connection-oriented
Connection less

In Connection-oriented, the path is chosen from source to destination.
In connectionless, no path is chosen and the data can move in any direction.
TCP is connection-oriented and UDP is connectionless.

Addressing
In the transport layer, addressing is port addressing. A computer may be running several programs at the same time. The communication at the transport layer is done by the client-server paradigm.

Reliability
Reliability means having error control and flow control. Sending transport layer makes sure that the entire message arrives at the receiving transport layer without error. Error control is usually carried out by retransmission.

Network Layer

It works for the transmission of the received data segment from one computer to another that is located in a different computer.
The network layer is a host-to-host delivery.

Design issues of Network Layer

Internetworking
Internetworking is the logical connecting of heterogeneous physical networks together to look like a single network to the upper layer protocols.
It supports data transmission from one network to another network.

Packetizing
The network layer encapsulates packets received from upper-layer protocols and makes new packets out of them.

Routing
Routing means making or choosing the path
Whenever there are multiple routes to the destination, we must make a decision and choose one route.
Each IP packet normally reaches the destination via several routes.
The packet can't choose the route, the routes connecting LAN, and WAN make the decision.

Addressing
The network layer supports only IP addresses. The address used in the network layer must uniquely and universally define the connection of a host or router to the internet.

Fragmentation
Simply fragmentation means dividing.
A packet can travel through different networks,each router decapsulates the IP packet, process it, and encapsulates it in another frame.

Data Link Layer

The data link layer allows you to directly communicate with the computers. The data unit in the data link layer is called a frame. The main responsibility of the data link layer is the node-to-node delivery of data.

Design issues of the Data link layer

Framing
The process of encapsulating the data in a frame coming from an upper layer is called framing. A frame is a manageable unit.

Error control
It is used to find out if the data is lost or corrupted. Error control is divided into two categories. Error Detection and Error Correction.

Flow control
It controls the flow of data. It means, how much data the sender has to send before receiving an acknowledgment.

Addressing
In the data link layer, physical addressing is used. Physical addressing is also called MAC address and local address. The Mac address is 48 bits.

Media Access Control
The data link layer allows the upper layers of the OSI model to access these frames and it also controls how the data is placed and received from the media using media access controllers.

Physical Layer

The physical layer is the bottom-most layer of the OSI model. It transmits the data bits from one computer to another computer through a physical medium. It establishes, maintains, and deactivates the physical connections. It also performs the synchronization of the bits. And it is directly connected to transmission media.

Functions of the physical layer

It defines the transmission mode.
It defines the type of signal used for transmission.
It performs the bit-to-signal transformation.
It defines the way, how two or more devices are connected physically. The data in the physical layer is in the form of a sequence of bits and it is transmitted in the form of signals.

TCP/IP Network model

The TCP/IP model, older but still widely used, simplifies networking into five layers:

Protocols in TCP

In the Application layer, the protocols used are SMP, HTTP, FTP, DNS, and SNMP.
In the Transport layer, the protocols are TCP and QDP.
In Network layer,the protocols are ARP,IP,IGMP,RARP,ICMP.

Conclusion

Computer networks are the backbone of the digital world. They make it possible for us to share files, browse the internet, and communicate across the globe. Learning the basics of networks, their layers, and how they work helps you understand the internet better.

Thanks for reading the blog and investing your time 😊. I hope you find this blog insightful and you learn something out of this. If you did, then shower some support by giving a reaction to the blog.

Every Student Needs to Join a Tech Community

Iqra Firdose — Tue, 10 Dec 2024 16:25:56 +0000

Introduction

When you don't have any environment and people to guide and help you then the communities will come to assist. You can't maintain consistency in learning but when you have a group of people, they also learn the same thing which helps you to learn things quickly. These like-minded people are found in communities. Communities play a vital role for every student and professional. In this blog, I share about the communities and benefits of being part of communities as a student.

What is Community?

A group of individual people that share their experiences, and knowledge and learn from each other quickly and efficiently.

If we see two people and they are connected, they share their knowledge, and experiences and guide each other because as humans we like to share and learn from each other. If these two are connected with another person then the trio shares.Then if we connect with the group of people that forms a community.

The main principle of every community is to help and guide you and it follows giving back to the community in any form like content, sharing resources, guidance, and mentoring.

Grow together with the community.

Why Communities?

GitHub started as a community. The company was founded by two developers who needed a way to collaborate with other developers. They created GitHub as a way to share their code and collaborate with other developers.

Today, GitHub is one of the largest and most active Tech communities in the world. There are millions of users on GitHub, and they come from all over the world.LinkedIn and MLH also started as a community.
Over time, they became active spaces where people work together, share ideas, and find new opportunities. This shows how communities can bring big ideas to life and create strong connections.

Why do you need to join a Tech community?

Let's understand with an example:
The Student
The student saad wants to learn to code. But saad doesn't know the proper resources to learn to code. He doesn't have friends who are interested in Tech. There is Social Motivation, a type of motivation that helps to complete tasks by seeing others who are doing the same thing.

Tech Community
Then Saad finds a tech community with the tech that the student wants to learn. The tech community provides the resources to learn to code. With the help of the tech community, the saad can learn to code and able to build their projects.

The Motivation
The tech community also motivates students. Seeing the people in the community who are learning to code and building projects, inspires the student to keep learning. Now, the saad knows that he is not alone in this journey and the community is there to come along the way.

The Outcome
Saad is capable of creating projects and is even able to help people who are learning to code and guide people to build the projects. Saad is grateful for the support of the community, and he knows that he can't be able to learn to code without them.

I hope this example shows how the tech community can help students who are interested in learning to code. The tech community is a valuable resource for anyone interested in technology, and it can provide help, motivation, and resources to help you achieve your goals.

Benefits

Peer-to-peer learning and collaboration on projects
In the tech community, you will find those who are learning the same technology and you can collaborate to build projects together. That helps to deep insight into the tech.

sharing knowledge
In Tech communities, you can also share your knowledge and help other people. With this, you can improve your knowledge.

Knowledge increases when you share the knowledge

Learn from experienced professionals
One of the best ways to learn about technology is from people who are already working in the field. Tech communities give you the opportunity to connect with experienced professionals who can mentor you and share their knowledge.

Mentorship opportunities
By being part of communities, you can find a mentor who guides you to learn the technology or you will be a mentor for someone whom you can guide into the tech.

Stay up-to-date on the latest technologies
The tech community provides resources and guides on the latest trends in technology. This will help you know about the new technologies.

Know about various opportunities
You will get to know various opportunities by being part of the tech community like programs, events, and conferences.

Network and Meet with like-minded people
Tech communities are a great way to meet other people who share your interests. This can lead to new friendships, job opportunities, and even collaborations.

How to find communities?

You can find local communities in your college.
In your college, if no communities are present then can find local communities in your place or areas such as GDGs, AWS, and many more.
And, You can find amazing online communities and there are global communities as well.

The steps you need to follow to find the right tech communities:

-> Analyze and understand what you are looking for.

-> Every community has an aim or technology it is about.

-> Built communication with the community members to know about the community.

-> Get prepared to learn, contribute, and grow.

How to Get Involved in Communities?

The steps you need to follow to get involved in communities are as follows.

Step 1

Identify and figure out the communities. As there are lots of communities are there, choose the communities as per your interest in the tech.

Step 2

Join their communities like Slack channel and Discord channel. Then introduce yourself to the community.
Joining the communities helps you to ask your doubts and definitely at least one person from the community can answer your question.
You can join channels through the website, as the community websites keep their channel links.

Step 3

Staying up to date with the communities. You can follow their social handles.
We need to know about the communities that we are a part of. What is happening in the community, can be done by keeping an eye on their social media.

Step 4

Open-source contribution Contribute to the community, go to the Github repo, and start contributing. Find issues related to your interest, if you can't able to find issues you can ask in their channel.

Step 5

Be active in the community.
Help others and be humble to answer everyone's questions.
Learn and build connections.
Attend Meetups and conferences.

I hope this blog has convinced you to join a tech community. It's a great way to learn, grow, and connect with other people who share your interests. So what are you waiting for? Join the community now!
Community is all about

Community=Learning+Building+Networking+Collabration+Experience+Skills

If you're still here, Thanks for reading the blog and investing your time 😊. I hope you find this blog insightful and you learn something out of this. If you did, then shower some support by giving a reaction to the blog.

Let me know in the comments, and share the communities you are a part of. Let's learn together by being part of the communities.

Unveiling the Magic Behind Your Computer: A Deep Dive into Operating Systems

Iqra Firdose — Tue, 19 Nov 2024 08:43:18 +0000

Introduction

An operating system, commonly known as OS, is an essential software program that manages all the hardware and software resources of a computer system. It acts as an intermediary between the computer hardware and the applications software. In this article, we will discuss what an operating system is, why it is necessary, and the problems that can arise without an operating system, using real-life examples

What is the Operating system?

Before we know what an operating system is, let's see why we need an operating system with examples.

Why do we need an operating system?

Let's understand with an example, You are running your YouTube on a small computer that contains a CPU, memory, GPU, and disk. YouTube requires some CPU, memory, GPU, and disk resources. Since there is no operating system in place, YouTube is directly accessing these resources.

You want to use Google, but its resources are being taken up by YouTube and there are no resources available for Google. You have sufficient resources to use both applications, so you can allocate some resources to each application. The operating system layer will ensure that resources are allocated in a correct and efficient manner.

With this, we understand that it managing the resources. So, it is known as Resource management.

Os as a resource manager:

In technical terms, Os acts as an interface.

Interfaces are tools and concepts that technology developers use as points of interaction between hardware and software components.

Let's understand with an example, we all go to the bank, the person is you and you want to withdraw some money that is deposited in the bank. You went to the bank and you asked the person in the bank that you want to withdraw money. The bank person instructs you to fill in the slip, fill in your details then he will give you the amount. Here, you are not going to the locker of the bank, you are going through the bank person. The bank person takes the money from the locker and then gives it to you.

Here, the bank person is working as an interface. you are not going to the locker, the bank person is going. So, the bank person is the interface.

The person is app and the bank person is Interface and the locker is the resources like CPU, GPU...So we understood that OS is acting as an interface between the resources and the user app

problems with not having os

Resource management
For the youtube and Google applications, it writes the code of the application and it also needs to write code for memory management and resource management.

As the code increases, the app becomes bulky. With this, we are violating the DRY rule. The DRY rule is Do Not Repeat Yourself, It means calling again and again as functions in the programming languages. Here, we are writing resource management and memory management code for both applications youtube and Google. The Operating system handles the Resource management code and we do not need to write the code for resource management.

Another problem with not having OS

Isolation and protection
Let's say an example, YouTube is in the memory and Google is also in the memory, when you are on it, YouTube uses some memory, and Google also takes some memory. If we see their memories separately, if OS is not there, no isolation is present. Isolation means both memories should be apart from each other, youtube should be unaware of Google. If OS is not there, it may be possible YouTube may write something in Google memory. Google thought that it was running independently, but other apps came and wrote something, this is a security violation, and there will be no memory protection.

If OS comes into the picture, it will logically store the section of memory allocated to YouTube. Now OS will control that YouTube should be unaware of Google, and both memories should be separated. So, In this way, OS will provide memory isolation and protection to multiple apps.

What is an Operating System?

An Operating System is a piece of software that manages all the resources of a computer system, both hardware and software provide an environment in which the user can execute his/her programs in a convenient and efficient manner by hiding the underlying complexity of the hardware and acting as a resource manager.

Examples of Operating Systems :

Windows: Microsoft created the well-known operating system known as Windows. It is utilized by servers, personal computers, and other hardware.
macOS: Apple created the macOS operating system computer. It has a graphical user interface and cutting-edge multimedia functions.
Linux: Used in servers and other devices, Linux is an open-source operating system. It offers sophisticated customization and security features.
Android: Google created the Android operating system for mobile devices like smartphones and tablets. It gives people a means to use the apps and services that are available on their devices.

Operating system goals
There are two main goals of an Operating System:

Convenience:
The primary goal of OS is to make computer systems easier for users i.e OS makes the interaction between the user and hardware.
Efficiency:
The secondary goal of OS is to allocate the system resources to various application programs as efficiently as possible.

Operating System Functions
Following are some of the important functions of an Operating System

Memory Management: Memory Management is the process of managing memory. The Operating System keeps track of Memory i.e., what parts of it are in use by whom, and the OS decides which process will get the memory when and how much.

Processor Management: In a Multiprogramming environment, the OS decides which process gets the processor when and for how much time. The function is called Process Scheduling.

Device Management: An Operating system keeps track of all devices and decides which process gets the device when and for how much time.

File Management: The Operating system manages the files in an efficient way and keeps track of information, location, and uses.

Operating System also provides security.

Conclusion
The operating system plays an important role in the computer system. As the computer system consists of hardware and software. The operating system provides the interface for the proper use of these resources in the operation of the system. In this article, we briefly discuss operating systems with examples.

Connect with me on Twitter and Linkedin.

Guide to Open-source contributions

Iqra Firdose — Sun, 19 Mar 2023 18:44:32 +0000

Introduction

Behind every successful Open-source project, is a dedicated team of contributors and maintainers who help make it happen. Open-source projects have been streaming nowadays. Open-source contribution is a great initiative to learn and apply your knowledge. This article discussed open-source, benefits, and ways to contribute.

What is Open-source contribution?

An open-source project is one whose source code and documentation that is licensed are freely accessible to the public. Anyone, not just software engineers and developers, can modify, study, and improve the project, and anyone, not just software engineers and developers, can contribute to open-source projects.

Perks of Open-source contribution

There are many perks of contributing to open-source projects, some of which include:

-> With open-source contributions, you are applying your knowledge to real-world applications.

-> Contributing to open-source projects helps to build a portfolio of work that showcases your skills, as it allows you to showcase the open-source project that you added value to through your contributions.

-> It helps to improve your skills, by open-source contributions you will gain exposure to new technologies and tools.

-> By contributing to open-source projects, you'll have the opportunity to connect with other developers and members of the open-source community.

Open-source contributions= Collaboration + contribute

-> Open-source contributions give access to learning new technologies. By open-source contributions, you can stay up to date with new technologies.

-> Some open-source programs will pay you for contributions.

-> With Open-source contributions, You can help others by resolving their doubts and solving their bugs.

-> Open-source is all about giving back to the community. You will get a chance to be a part of these amazing communities with open-source contributions.

Overall, contributing to open-source projects will benefit professional development.

How to contribute to open-source projects?

Choose a project and understand it: First, you need to identify an open-source project that you're interested in that matches your skillset.
Read the documentation and follow the guidelines: Once you've found a project, read the project's documentation thoroughly to understand how the project works and what contributions are needed.
Look for issues: Most open-source projects have a list of issues. Issues refer to the available problems that are placed in an open-source repository so that you can solve the problem or you can create new issues if you find any problem or you want to add a new feature to it and you want to solve that problem.
Fork the project: Fork the project to create a copy of the project in your GitHub account that you can work on.
Make your changes: Once you've identified an issue, make changes to the project.
Create a pull request: Create a pull request to the project explaining the changes you made and why they're necessary. Then the maintainer(admin) of the project checks your pull request and if it finds it useful then the maintainer merges(accepts) the pull request.

By following these steps, you can contribute to open-source projects.

Ways to contribute to open-source contributions

There are several ways to contribute to open-source contributions. Some of them are:

Code Contributions : You can contribute to the code of the project. You can add a new feature to it or you can solve bugs by writing the code.

Documentation contributions : This involves writing or updating documentation for the project, such as adding examples, improving the read-me file, or fixing errors.

Designing: You can contribute to the project with the UI design of the project or you can help them in designing posters or social media visuals designs.

Testing: You can contribute to open-source projects as a tester as well. you can test the application, documents of a project, or anything where you want to contribute. You help them find bugs in their product/application by providing an explanation of the bug and helping fix problems.

Reviewing Pull requests: As lots of PR is made, you can help them by reviewing PRs and correcting them with the contributor.

Community contributions: It involves helping people to contribute and answering their questions and organizing events for the communities.

By contributing in any of these ways, you will access the perks of open-source contributions.

Conclusion

open-source projects have transformed the way we develop, use, and share technology. By providing free access to the source code and encouraging collaboration and innovation, open-source projects have helped to create a more inclusive technology landscape.

Contributing to open-source projects offers many benefits, including gaining new skills, building a portfolio, making connections, and contributing to the community. By participating in open-source projects, you can not only improve your own knowledge and experience but also make a positive impact on the project and the people around you.

I hope you will find this blog insightful. Let me know in the comments, have you started with an open-source contribution.

Thank you for reading this blog, if you found it useful, you can like and comment and follow us.

DEV Community: Iqra Firdose

The Ultimate Beginner's Guide to Using Color in CSS

Hexadecimal Colors

RGB Colors

RGBA Colors

Predefined/Cross-browser Color Names

HSL Colors

HSLA Colors

Opacity

Color Contrast and Accessibility:

Calulate Color Contrast

Gradients

Linear Gradient

Radial Gradient

Tools and Resources

Color Palette Generators:

A Beginner’s Guide to Computer Networks and the OSI Model

Introduction

Networks

How Did It Start?

WWW (World Wide Web)

Protocols

OSI(Open System Interconnection) Model

Application Layer

Presentation Layer

Session Layer

Transport Layer

Network Layer

Data Link Layer

Physical Layer

TCP/IP Network model

Every Student Needs to Join a Tech Community

Introduction

What is Community?

Why Communities?

Why do you need to join a Tech community?

Benefits

How to find communities?

How to Get Involved in Communities?

Unveiling the Magic Behind Your Computer: A Deep Dive into Operating Systems

Introduction

What is the Operating system?

Why do we need an operating system?

Os as a resource manager:

problems with not having os

What is an Operating System?

Examples of Operating Systems :

Guide to Open-source contributions

Introduction

What is Open-source contribution?

Perks of Open-source contribution

How to contribute to open-source projects?

Ways to contribute to open-source contributions

Conclusion

Connect with me: