teleren/devto huggingface dataset:
Learning how to build a compiler: My journey
Tags: learning, c, compiler, programming
Published: 2023-01-07 15:09:26

Learning how to program can feel like a large and complicated task. And for the most part, it is. Right now I'm pushing to better understand the C programming language. I have learned many other languages like Java, Python, and a little C++. 

I was lucky to have a father that spent time teaching me how to write code, even if it was frustrating. He is not good with words, but he gave me a path to follow. Sometimes all your need is a starting point. If you are just starting on your programming journey, go and find a programming language that doesn't look too scary and just start.

Right now I am learning about compilers and trying to write my c compiler in the c programming language. It has been a fun task, I think it's funny that you can compile a language with itself. I learned about that technique, which is called bootstrapping from a YouTube video. 

It has taken me a lot of time to get through the project, and I am only at the beginning. I have written part of the Lexer, which is the part of the compiler that breaks down the text into small chunks called tokens. These tokens contain the type of token it is; for example, "int" or "left parenthesis". 

These tokens then get organized into an abstract syntax tree or AST. This is the part that I get confused about.  The AST is used to organize the tokens logically, so for a = b + c, there would be a branch for b + c and then another branch to add that calc to a. 

Taking on projects that are almost out of your reach is a great way to expand your thinking and problem-solving ability. While learning about lexers, I was in college and one of our projects needed to parse some data that we were scraping off of the web. I was able to bring in what I knew about lexers and parsing into the code that we wrote. Even though I didn't write a lexer exactly, I used the knowledge to build something different.

If you like this content, please like it. And if you want to be updated on my work, please sign up for the email list.

[Here is a link to the compiler Github repo](https://github.com/Yelk11/Compiler)
Customising a file input using Tailwind CSS
Tags: tailwindcss, javascript, webdev, react
Published: 2023-01-07 15:05:36

I recently found out that Tailwind CSS now supports file input customisation as of v3 - (https://tailwindcss.com/blog/tailwindcss-v3#native-form-control-styling)

All the functionality of the file input stays the same but Tailwind allows you to style most things without the usual headache.

---

<u>**Customising a file input's styles**</u>

```javascript
<form>
  <input
    type="file"
    class="block w-full text-sm text-slate-500
        file:mr-4 file:py-2 file:px-4 file:rounded-md
        file:border-0 file:text-sm file:font-semibold
        file:bg-pink-50 file:text-pink-700
        hover:file:bg-pink-100"
  />
</form>
```

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/54079vlt8o2jup00h1l5.png)


---


However, if you do need more customisation you can always build a file input yourself like below.

<u>**A custom file input altering the "No file chosen" text using React**</u>
```javascript
const CustomInputExample = () => {
  const [selectedFile, setSelectedFile] = useState("No file chosen");

  return (
    <form>
      <div class="flex flex-row items-center">
        <input
          type="file"
          id="custom-input"
          onChange={(e) => setSelectedFile(e.target.files[0].name)}
          hidden
        />
        <label
          for="custom-input"
          class="block text-sm text-slate-500 mr-4 py-2 px-4
            rounded-md border-0 text-sm font-semibold bg-pink-50
            text-pink-700 hover:bg-pink-100 cursor-pointer"
        >
          Choose file
        </label>
        <label class="text-sm text-slate-500">{selectedFile}</label>
      </div>
    </form>
  );
};
```
![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/mcmmimr21t0jk6yyl4pu.png)


---


A JSFiddle with the examples - (https://jsfiddle.net/DevJamesHay/dh0sz5pe/261/)
What happens when you type 'https://www.google.com' in your browser
Tags: webdev, blog, webcomponents, web
Published: 2023-01-07 14:50:15

When you type "https://www.google.com" into your browser and press Enter, a series of events occurs in the background to bring the Google homepage to your screen.

First, your browser sends a request to the Domain Name System (DNS) to resolve the domain name "google.com" to an IP address. The DNS is a distributed database that maps domain names to IP addresses, allowing computers to communicate with each other using human-readable names rather than numerical IP addresses.

Once the IP address for "google.com" has been retrieved, your browser sends a request to the server using the Transmission Control Protocol (TCP) and the Internet Protocol (IP). TCP and IP are the fundamental communication protocols that make up the internet, and they work together to ensure that data is transmitted reliably from one computer to another.

Before the request can reach the server, it may pass through one or more firewalls. Firewalls are security systems that control incoming and outgoing network traffic based on predetermined security rules. They can be hardware-based, software-based, or a combination of both.

When the request reaches the server, it is first intercepted by a load balancer. Load balancers distribute incoming requests across multiple servers to balance the load and improve the performance of the system. In the case of Google, there are likely to be many servers handling requests for the website, and the load balancer distributes the requests among them to ensure that none of the servers become overwhelmed.

Once the request has been passed on to a specific server, it is handled by the web server. The web server is responsible for serving the HTML, CSS, and JavaScript that make up the user interface of the website.

If the request requires more complex processing, such as a search query, it may also be passed on to an application server. The application server executes the business logic required to fulfill the request and may also query a database to retrieve data.

Finally, the server sends the requested data back to the browser, which renders the page and displays it to the user. If the original request was made using HTTPS, an additional layer of security is provided through the Secure Sockets Layer (SSL) or Transport Layer Security (TLS) protocol. SSL/TLS encrypts the data transmitted between the server and the browser to protect it from interception by third parties.

In summary, when you type "https://www.google.com" into your browser and press Enter, a series of interconnected systems work together to resolve the domain name, transmit the request, process the request, and return the requested data to your browser, all in a matter of seconds.
Neural Network
Tags: beginners, python, programming, machinelearning
Published: 2023-01-07 14:38:41

In deeplearning, neural network most of the time uses various layers for doing a work. The neural networks can be both simple and complex. The concept of working with several layers comes from the functions of the brain.
![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/sfg6sx1nmjnhu78ltw6d.png)

In this image, we are seeing a neural network with 3 layers. The input x is taken as 0th layer. Then the layer containing three circles is the 1st layer. The circles are usually called units and they are actually information. After that, the 2nd layer that comes is the output layer where we get the output after passing an input x to a machine learning model. Lastly we use logistic regression to find out if the data is effective or not. Now, we are also going to see an example of complex neural network layers. Below is the image of a more complex neural network layer.
![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/1heiwvpyjqsvw1ejcd2d.png)

In this image, we can see that there are more layers than the previous image. In this image, the outputs of a particular layer are working as the input of the next layer. In this case a formula is also working. For determing the result of a particular unit of a given layer, a formula is used which is the equation of a straight line.

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/8z52st99pxzxg7ovd72b.png)

Here, g = wa + b is the formula. In this formula w and a are vector quantities. This is all about neural network layers.
How to good at studying programming
Tags: programming, beginners, tutorial, career
Published: 2023-01-07 14:02:18

Studying something new is not always easy for me, especially programming. The first time I went into my university, I have no idea about a thing that we call code, and I thought that university is a good way to help me master at coding and become a quality coder. But over two years studying programming, trust me the only person can help you good at coding is not university, lecturer or friends but **yourself**. I realized that the best study method that can help you become a high-quality coder is something that we call **self-study**. But **self-study** is not easy to have it since it took me 1 year to good at it. That why I decide to write this blog to help you start your **self-study** journey by specify 5 things that you must have to become a self-study master.

## 1. Specify a clear study roadmap

Knowing exactly what we have to learn is the best way to save tons of your time since you know that what are you studying for and know that we are in the right way. You can specify your own roadmap by searching Google, YouTube or just ask your expert. And trust me, make your study plan clearly is helping you become a passionate learner.

## 2. Start making your study schedule

Now have a clear understand at what we need to achieve our goal is good, but not enough because right now we need to have a clear self-study schedule. Doing this is a really good way to manage your time properly.

## 3. Choose a quality course, resource

Self-learning doesn't mean that we have to learn anything by your-self, you can self-study by joining an online course or watch a specific online tutorial. And **YouTube** is one of the best platforms to find such a high-quality online tutorial.

## 4. Always curious

During the self-study process, remember to always be curious because curious is just help us have a better understanding about it. _Never hesitate to ask Google why we have to type this line of code like this but not like that._ 

## 5.  Practice is the key.

I have seen many of my friends learning a lot but never practice, that why when they meet some practical case, they don't know how to utilize their knowledge into it. So, remember practice is the key, do not studying so much without applying them into any practical project.

## Conclusion

That are 5 basic things you need to have if you want to be good at self-study.

If this post was useful to you, please leave a like and comment below that help me a lot <3.

Refer to my [GitHub](https://github.com/trinhcamminh) and [portfolio](https://minhct.netlify.app/) website for more amazing content just like this <3
5 Reasons Why Fat Arrow Functions are the Future of JavaScript
Tags: webdev, javascript, programming, adventofcode
Published: 2023-01-07 14:33:16

1. Easier to Read:  Fat arrow functions are easier to read and understand than regular functions. They use a much simpler syntax, with no need for brackets, parentheses, or the function keyword. This makes it much easier to read and understand the code.


2. Faster Development Time: Fat arrow functions can help speed up the development process. By writing code with fewer characters, you can save time and write code more quickly. This can help you build projects faster and more efficiently.


3. Better Performance:  Fat arrow functions are more efficient and perform better than regular functions. They use less memory, so they can run faster and consume less processing power. This can help save time and improve the performance of your application.


[Clicked To Visit Full Article Originally Published On:-07/01/2023](https://www.javaoneworld.com/2023/01/5-reasons-why-fat-arrow-functions-are.html)
Paracetamol.js💊| #196: Explica este código JavaScript
Tags: javascript, webdev, spanish, programming
Published: 2023-01-07 14:20:00

## **<center>Explica este código JavaScript</center>**
#### <center>**Dificultad:** <mark>Intermedio</mark></center>

```js
const set = new Set([1,2,1,3,4,3]);
const x = Array.from(set, (num) => (num**2) - 1 ) // 🤔 
```

A. `Syntaxis Error`
B. `[1, 4, 9, 16]`
C. `[0, 3, 8, 15]`
D. `Ninguno de los anteriores`

Respuesta en el primer comentario.

---

Respuesta:
C. `[0, 3, 8, 15]`

El método estático de arreglos `Array.from()` recibe un iterable por parámetro y lo convierte en un arreglo, de hecho eso es lo que hace con el `set` del ejemplo.

Lo que no muchos saben es que también recibe un segundo parámetro opcional que es una función transformadora, muy paarecida a un `map` de toda la vida. 

Con esta función elevamos al cuadrado y restamos una unidad a cada item del arreglo.
DevOps Demystified
Published: 2023-01-07 13:46:32

DevOps is a software development approach that combines software development (Dev) and information technology operations (Ops) to shorten the systems development life cycle while delivering features, fixes, and updates frequently in close alignment with business objectives.

At its core, DevOps is all about communication, collaboration, and integration between software developers and IT operations professionals. It aims to help organizations deliver value to their customers faster and more reliably by adopting a culture of continuous delivery and improvement.

One of the key principles of DevOps is automation. Automation helps to eliminate manual, error-prone tasks and allows teams to focus on more important work. This includes automating the build, test, and deployment process, as well as the management of infrastructure and application environments.

Another important aspect of DevOps is measurement and monitoring. By continuously collecting and analyzing data on the performance and stability of systems, teams can identify and fix problems quickly, before they impact users.

There are several tools and technologies that are commonly used in DevOps, including version control systems (such as Git), continuous integration and delivery (CI/CD) platforms (such as Jenkins and Travis CI), infrastructure as code (IaC) tools (such as Terraform), and containerization platforms (such as Docker).

Adopting a DevOps approach can bring many benefits to an organization, including:

- Faster delivery of features and updates to customers
- Increased efficiency and collaboration between development and operations teams. 
- Improved stability and reliability of systems Enhanced security through automation and continuous testing. 

However, it's important to note that successfully implementing DevOps requires a cultural shift within an organization. It's not just about adopting new tools and technologies, but also about breaking down silos and fostering a culture of collaboration and continuous improvement.

In conclusion, DevOps is a software development approach that aims to improve the speed, stability, and reliability of systems through automation, collaboration, and continuous improvement. It requires a cultural shift within an organization and the adoption of tools and technologies that support the DevOps principles.
How to Spin an EC2 Instance in AWS?
Tags: aws, linux, challenge
Published: 2023-01-07 13:32:34

**What is EC2 Instance?**

Ever wondered how you can create and maintain your own Virtual Machines in just few clicks? EC2 Instances come for your rescue. In this we are going to learn how to spin an EC2 Instance in AWS. 

**Requirements**

- AWS account - If you don't have one make sure you get one 
                created before proceeding further.

**Step - 1**

- Login to your console [https://aws.amazon.com/console/] 

- Search for the service "EC2" you'll land on the following page.


![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/82n4nstr9nu7rinh69dp.jpeg)

As you can see currently there are no instances running. 

- Navigate in Instances tab from dashboard and click on Launch 
  Instance.

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/4c5aof1if41a4ksz6ic3.jpeg)

You'll end up on the below page.


![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/vc9slvpqrdxuagremrnc.jpeg)

Enter the instance name i.e MyFirstInstance and select the storage and launch type. For this tutorial I would be using t2.mirco and Amazon Linux machine as an launch template. (So I won't incur any costs)

**Step - 2**

- We need to create a new key pair.
 
![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/d5ecrqpwbdtr6h2d0w8n.jpeg)
Make sure you don't loose you .pem or .ppk file as that would be used to ssh into your instance.(We can also use Instance connect which is way easier)

**Step -  3**

- For networking we'll be creating new security group which allows to ssh from anywhere i.e 0.0.0.0/0

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/hwjiij42n33cni9uuumv.jpeg)

Leaving the rest of the settings as default. Click on the launch Instance.

![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/w8sdt6l861l282xx2q27.jpeg)

_Viola! You have successfully launched an EC2 Instance.
Make money from code: the fastest way
Tags: makemoney, money, code, developer
Published: 2023-01-07 13:27:00

As a software developer, you have a valuable skillset that can be leveraged to make money. But what is the fastest way to turn your coding skills into cash? Here are a few suggestions:
Freelance: One of the fastest ways to start making money from code is to offer your services as a freelance developer. There are many websites and platforms that can help you connect with clients looking for developers, such as Upwork, Freelancer, and Toptal. By working as a freelancer, you have the freedom to choose your own projects and schedule, and you can start earning money relatively quickly.
Sell digital products: Another way to make money from code is to create and sell digital products, such as apps, games, or plugins. If you have a great idea for a product and the skills to build it, you can sell it online through platforms such as the Apple App Store or the Google Play Store. This can be a fast way to make money, especially if your product becomes popular and generates a lot of sales.
Offer to consult or training services: If you have a lot of experience and expertise in a particular area of software development, you can offer to consult or training services to other developers or organizations. This can be a fast way to make money, as you can charge for your time and expertise.
Create a course: Another way to make money from code is to create and sell an online course. If you have a unique perspective or expertise that you think would be valuable to other developers, you can create a course and sell it through platforms such as Udemy or Teachable. This can be a fast way to make money, especially if your course becomes popular and generates a lot of sales.

In conclusion, there are several fast ways to make money from code, including freelancing, selling digital products, offering consulting or training services, and creating an online course. By leveraging your coding skills and expertise, you can turn your passion for programming into a lucrative career.
10 open source projects you should be aware of in 2023
Tags: opensource, programming, webdev, productivity
Published: 2023-01-07 13:25:20


A well curated list of the most interesting development tools and projects on GitHub in 2023.

## 1. [Linux](https://github.com/torvalds/linux)

One of the most popular open source operating systems, it is used on servers, desktop computers, and mobile devices.

![Linux.gif](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/5ck28u2m0iogrqeb3ucc.gif)

## 2. [Git](https://git-scm.com/)

A popular version control system for tracking changes in code and collaborating on software development.

![Git.gif](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/e2oaagchpobohx02n2cj.gif)

## 3. [Docker](https://github.com/jenkinsci/docker)

A platform for designing, delivering, and operating containerized applications.

![Docker.gif](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/7l0p9v5wivbn0l0hl540.gif)

## 4. [Kubernetes](https://github.com/kubernetes/kubernetes)

An open source container orchestration system for automating the deployment, scaling, and management of containerized applications.

![Kubernetes.gif](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/g0r4wfefvibo0czwh75v.gif)

## 5. [TensorFlow](https://github.com/tensorflow/tensorflow)

An open source machine learning framework developed by Google.

![Tensorflow.gif](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/brqtplv1cewf5awn411x.gif)

## 6. [Apache Cassandra](https://github.com/apache/cassandra)

A NoSQL database that is extremely scalable and commonly used for handling enormous amounts of data.

![Apache.gif](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/lrwtxuv96ywz7p3og42k.gif)

## 7. [Elasticsearch](https://github.com/elastic/elasticsearch)

A search engine based on the Lucene library that is commonly used for log analysis and business intelligence.


![ElasticSearch.gif](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/rbjy2cuz8zgk8fg993sc.gif)

## 8. [Ansible](https://github.com/ansible/ansible)

An open-source automation tool that is widely used for configuration management and application deployment.


![Ansible.gif](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/8dvz01h6mz4y1gtyfui4.gif)

## 9. [Spring Framework](https://github.com/spring-projects/spring-framework)

A widely used open-source Java framework for building enterprise applications.

![Spring.gif](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/qcjc2ja2vckpyns8jold.gif)

## 10. [React](https://github.com/facebook/react)

A JavaScript library for building user interfaces, it is widely used for building web and mobile applications.

![React.gif](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/suhme95onj1k18bgzwfv.gif)

## Thanks for reading! 👨‍🚀👨‍🚀👨‍🚀