teleren/devto huggingface dataset:
raw.githubusercontnet.com blocked by act-fibernet https://www.actcorp.in/
Published: 2023-01-06 13:36:46

---
title: raw.githubusercontnet.com blocked by act-fibernet https://www.actcorp.in/
published: true
description: github-content-domain-blocked-india-act-fibernet-broadband
tags: 
# cover_image: https://direct_url_to_image.jpg
# Use a ratio of 100:42 for best results.
# published_at: 2023-01-06 12:33 +0000
---

The internet service provider act-fibernet has blocked the github content site raw.githubusercontent.com saying it is blocked as per an order from Madras high court, but did not provide court order reference.

Apparently airtel and other internet providers do not block the site.

So how to access raw.githubusercontent.com using two internet connections, one is blocking it and another is not blocked.

Make a wifi hotsopt from your mobile or get a airtel or jio dongle.

Connect to wifi and act internet via network cable in your laptop or desktop computer. If you don't have wired internet, get a wifi usb dongle and connect to the mobile hotsopt through the wifi usb dongle, such that you are connected to two internet connections simultaneously.

Follow the steps to setup the routing:

- Get the current status of network connections in your laptop
```
ip route list
# default via 192.168.0.1 dev wlp0 proto dhcp metric 100 
# default via 192.168.1.1 dev wlp1 proto dhcp metric 600 
```

- Consider `wlp0` is connected to actfiber net and `wlp1` is connected to `airtel` wifi:
```
# Find the ip address of raw.githubusercontent.com
dig @resolver4.opendns.com raw.githubusercontent.com +short
# 185.199.108.133
sudo ip route add 185.199.108.133/32 dev wlp1
```

- We have successfully modified the routing for `raw.githubusercontent.com` to be routed through airtel.

- This setting is not persistent, after you reboot your machine it needs to be set again.
Difference between Framework and library in the context of React and Angular
Published: 2023-01-06 13:23:07

**People often confuse or use the terms "framework" and "library" interchangeably without fully understanding the differences between them. In this article, we will clarify the distinctions between frameworks and libraries in order to better understand the key differences between them.**

- 1. A library is a collection of code that you can use in your program to perform a specific task. For example, the C standard library provides functions for performing input/output operations, mathematical computations, and other common tasks.

- A framework is a set of libraries and tools that provide a structure for building a particular type of software application. A framework defines the way that the different parts of an application should interact, and provides a set of conventions for building and organizing the code.

One key difference between libraries and frameworks is that with a library, you call the functions provided by the library to perform a specific task. With a framework, the framework calls your code in certain places, and you provide the implementation for those hook functions. This means that with a framework, you have less control over the overall flow of the program, but it can make it easier to build certain types of applications because the framework provides a lot of the "plumbing" for you.

**In the context of JavaScript web development, React and Angular are both frameworks for building web applications.**

1. React is a JavaScript library for building user interfaces. It was developed by Facebook and is often used for building single-page applications (SPAs) and mobile applications. React allows you to build reusable UI components, and it uses a virtual DOM (Document Object Model) to improve performance by minimizing the number of DOM manipulations required when rendering components.

2. Angular is a full-featured JavaScript framework for building web applications. It was developed by Google and provides a complete set of tools for building both the front-end and back-end of a web application. Angular uses a component-based architecture, and it provides a range of features including dependency injection, routing, and a template-based syntax for defining views.

_Both React and Angular are widely used for building modern web applications, and they can both be used to build applications with similar functionality. However, they have some key differences in terms of their design and the way that they approach building applications. For example, React is focused on building reusable UI components, while Angular provides a more complete set of tools for building an entire web application._

Thanks for reading.
What is Web 3.0? - The NEXT Generation INTERNET
Tags: web3, webdev, beginners, devops
Published: 2023-01-06 13:20:19




## For Beginners

Web 3.0 is like a super smart version of the Internet that can do more than just show you pictures and videos. It can actually understand the meaning of the things you look at and search for, and can even help computers and people talk to each other in a way that makes sense.
For example, if you use Web 3.0 to search for a recipe, it might be able to understand that you want a recipe for cookies and show you lots of different recipes for cookies. It might even be able to understand that you like chocolate chips and only show you recipes that have chocolate chips in them.
Web 3.0 is also really good at keeping your information safe and private. It uses something called "blockchain" which is like a special code that only you and the people you want to see your information can see. This helps to keep your information safe from people who might want to steal it or use it for bad things.
Overall, Web 3.0 is a really cool and powerful way to use the Internet that can make it easier and more fun to do things online.

## For Others:

Web 3.0, also known as the "Semantic Web," is the next generation of the Internet that is focused on creating a more intelligent and connected online experience. It is built on the idea of creating a web that is more intuitive and easier to use, with the ultimate goal of making it possible for computers and humans to better understand and interpret data on the web.
One of the key features of Web 3.0 is the use of artificial intelligence (AI) and machine learning (ML) to better understand and interpret data on the web. With the help of AI and ML, Web 3.0 aims to create a web that can better understand the meaning and context of the information it contains. This could lead to a more efficient and accurate web, with better search results and more personalized content.
Another key feature of Web 3.0 is the use of blockchain technology to create a more decentralized and secure web. By using blockchain, Web 3.0 aims to create a web that is less reliant on centralized servers and more resistant to cyber threats. This could lead to a more resilient and trustworthy web, with better protection for users' data and privacy.
Web 3.0 also aims to create a more connected and interoperable web, with better support for data exchange and integration between different systems and platforms. This could lead to a web that is better able to support the development of new applications and services, and that can more easily adapt to changing needs and requirements.
Overall, Web 3.0 represents the next generation of the Internet, with the goal of creating a more intelligent, secure, and connected online experience. While it is still in the early stages of development, Web 3.0 has the potential to revolutionize the way we use and interact with the web, and to drive the development of new technologies and applications.
Awesome Social Media Icons With Hover Effects (Font Awesome Icons & SVG Icons)
Tags: codepen, html, css, beginners
Published: 2023-01-06 13:19:41

<h1>Awesome Social Media Icons With Hover Effects</h1>

<h2>(Font Awesome Icons &amp; SVG Icons)</h2>

{% codepen https://codepen.io/Amiru-Weerathunga/pen/rNreyOG %}
AWS Amplify: Let's add some unit tests into our pipeline
Tags: aws, cloud, testing, webdev
Published: 2023-01-06 13:18:11

In the previous article, we saw how to set up a pipeline with AWS Amplify, but as long as things are simple everything works.
Let's complicate the pipeline, we will see how it is possible to customise the build phase by adding tests.

---

ℹ️ The goal is to run unit tests with [Jest](https://jestjs.io/) in the AWS Amplify pipeline.

---

## AWS Documentation

> You can edit an app's build settings in the Amplify console by choosing App settings, Build settings. The build settings are applied to all the branches in your app, except for the branches that have an amplify.yml file saved in the repository.

Reading the AWS documentation, we can find how to add the test steps in the deployment process and it seems easy.<br>

In the _amplify.yml_ file is possible to add the tests section 🎉

e.g _amplify.yml_ with test phases
```yml
version: 1
frontend:
  phases:
    [...]
test:
  phases:
    preTest:
      commands:
        - *enter command*
    test:
      commands:
        - *enter command*
    postTest:
      commands:
        - *enter command*
  artifacts:
    files:
        - location
        - location
    configFilePath: *location*
    baseDirectory: *location*
```

...but if we read in the detail, however, there is a small annotation 🥲

> You can run end-to-end (E2E) tests in the test phase of your Amplify app to catch regressions before pushing code to production. The test phase can be configured in the build specification YML. 
👉 Currently, you can run only the Cypress testing framework during a build. 👈

[AWS docs](https://docs.aws.amazon.com/amplify/latest/userguide/running-tests.html)

But the goal was to run unit tests and so my reaction was…

![meme](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/cg39yzm4114k4xrx55tc.png)

## Workaround

I searched a lot for a possible solution and through various tests, I found a way to get to my goal. 
Here is the solution: before running the build let's run the test script, this is a simple and effective way. 🚀

```yml
version: 1
frontend:
  phases:
    preBuild:
      commands:
        - npm ci
    build:
      commands:
        - npm run test && npm run build
  artifacts:
    [...]
  cache:
    paths:
      - node_modules/**/*
```

## Final result

I simulated both the situation with passing tests and failing tests.

### Test failed

![fail1](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/dabz2gifsns55yd1jxtg.png)

![fail2](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/bop9juzhf8ufqo56zdpv.png)

### Test passed

![ok1](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/ewzd2byfbvdv3a8q8kib.png)

![Ok2](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/9q5yo8virppulgjomtfe.jpeg)

## Final thought 

🎉 I'd say the build configuration is pretty straightforward, good job AWS Amplify team 😄

You can [follow me on Twitter](https://twitter.com/giorgio_boa), where I'm posting or retweeting interesting things.

I hope you enjoyed this article, don't forget to give ❤️.
Bye 👋

{% embed https://dev.to/gioboa %}
7 Must-Learn Things About JavaScript
Tags: javascript, webdev, beginners, programming
Published: 2023-01-06 13:16:33

JavaScript is a programming language that is widely used to build interactive websites and web applications. It is a powerful and flexible language that has a large and active community of developers. Here are some must-learn things about JavaScript:

Variables: Variables are containers that store values, and they are an essential part of any programming language. In JavaScript, variables are used to store data such as numbers, strings, and objects. You can use variables to store user input, perform calculations, and much more.

Functions: Functions are blocks of code that can be called and executed at any time. Functions are used to organize and reuse code, and they are an important concept in JavaScript. Functions can take arguments, which are values that are passed to the function when it is called, and they can also return a value.

Control structures: Control structures are statements that allow you to control the flow of your code. In JavaScript, control structures include if statements, for loops, and while loops. These structures allow you to write code that can make decisions, repeat actions, and more.

Arrays: Arrays are data structures that allow you to store a collection of values in a single variable. Arrays are useful for storing lists of data, such as a list of names or a list of numbers. In JavaScript, arrays are zero-indexed, which means that the first element of an array is at index 0.

Objects: Objects are collections of key-value pairs that represent a data structure. Objects are used to store data and behavior in JavaScript, and they are an important concept to understand. Objects can have properties, which are values associated with the object, and methods, which are functions that are associated with the object.

Events: Events are actions that occur in the browser, such as a user clicking a button or a page loading. In JavaScript, you can use events to trigger actions or reactions in your code. For example, you can use an event listener to listen for a user's click and then execute a function in response.

The DOM: The DOM (Document Object Model) is a tree-like structure that represents the HTML of a web page. In JavaScript, you can use the DOM to access and manipulate elements on a web page. This allows you to create interactive and dynamic web pages that respond to user input and events.

These are just a few of the must-learn things about JavaScript. There is much more to learn about this powerful and popular language, and there are many resources available online to help you get started.
What language or framework are you planning to learn in 2023?
Tags: discuss, webdev, javascript, programming
Published: 2023-01-06 13:15:31

With a new year come new resolutions! What programming languages or framework are you planning to learn this year?

P.S: If you haven't learned about Medusa yet, maybe you have another new year resolution! Check out our [GitHub](https://github.com/medusajs/medusa) repository and [documentation](https://docs.medusajs.com/) for more details.
Screenshot utility for mobile apps
Tags: macosx, windows
Published: 2022-12-13 21:02:06

---
title: Screenshot utility for mobile apps
published: true
date: 2023-01-06 13:00:00 UTC
tags: ["macosx", "windows"]
canonical_url: https://friendlyuser.github.io/posts/tech/screenshot_utility_for_mobile_apps/
---

This covers how to take screenshots of your mobile app using the ios simulator or android.


Oftentimes I find myself wanting to take a screenshot of my mobile app, but I don't want to have to use a third-party app to do so. This post covers how to take screenshots of your mobile app using the ios simulator or android.

## iOS

Note that the ios simulator does not come with a screen recorder.

On a Mac running macOS, the "shift + command + 5" keyboard shortcut will open the Screenshot utility. From there, you can click on the "Options" button in the bottom-left corner of the utility to access additional options, including the ability to record a video of your screen.

Once you have selected the "Record Entire Screen" or "Record Selected Portion" option, you can click on the red "Record" button to begin recording. To stop recording, you can either click on the "Stop" button in the menu bar, or use the "shift + command + 5" keyboard shortcut again and click on the "Stop" button in the Screenshot utility. The recorded video will be saved to your desktop by default.

![Screenshot utility](https://friendlyuser.github.io/imgs/2022/shift_command_5.png)

Alternatively, the simulator has a built-in screenshot utility that you can use to take screenshots of your app or simulator screen. Click on the camera icon in the top-right corner of the simulator command bar.


To take a screenshot on an iPhone or iPad simulator, follow these steps:

Start the simulator and open the app or screen that you want to capture.
On your keyboard, press the "Shift + Command + 4" keys. This will change your cursor to a crosshair.
Move the crosshair to the area of the screen that you want to capture and click and drag to select it. When you release the mouse button, the screenshot will be taken and saved to your desktop by default.

Alternatively, you can also take a screenshot on the simulator by pressing the "Shift + Command + 3" keys on your keyboard. This will take a screenshot of the entire desktop screen and save it to your desktop.

Note: The exact steps for taking a screenshot on an iPhone or iPad simulator may vary depending on the version of iOS and the simulator you are using. If the above steps do not work, you can try searching for instructions specific to your simulator and iOS version.


## Android

To take a screenshot on an Android emulator, follow these steps:

![Screenshot utility](https://friendlyuser.github.io/imgs/2022/android_emulator_pixel_3.png)

Start the emulator and open the app or screen that you want to capture.

Click on camera icon in right sidebar of the emulator.

Alternatively can use the mac osx screenshot utility to take a screenshot of the emulator or windows.


Or follow instructions at 

https://developer.android.com/studio/debug/am-video
acrobat sign in
Published: 2023-01-06 13:06:30

The  Awesomesuite is an social media management software which provides you the facility to edit the documents, any other social media content etc. It manages the given task for the teams to stay organized, save time and easily collaborate. Here in the Awesome Sign, you can create and download your edited document for free. In this tool software you can Sign and download your PDF/ document files according to you with the help of our Sign-PDF tool, where you can Sign in to fill and sign your files for free. 

[acrobat sign in](https://www.awesomesuite.com/sign/sign-pdf)
You miss Copilot ? Say hi GPT-3 pilot 🖖
Tags: gpt3, vscode, extention
Published: 2023-01-06 13:01:28

Hi, today I am sharing a cool tool that will allow you to quickly code with the programming language of your choice. This is the VS Code extension 'VSCode-ChatGPT'.

With this extension, programmers can write and run code quickly and easily. It offers helpful autocomplete moments, autocorrect to help catch language errors, and as a bonus (best in my opinion💎), a set of preconfigured templates for different specifics. Even if you've never programmed before, you may find ChatGPT's syntax wizard useful for learning the syntax of different languages.

I invite you to give it a try today to find out what it can do to improve your workflow. It's free and easy to use!

[VSCode-ChatGPT](https://marketplace.visualstudio.com/items?itemName=gencay.vscode-chatgpt)
"asdf" multiple runtime version manager to install node.js
Tags: asdf, node, npm
Published: 2023-01-06 12:58:40

---
title: "asdf" multiple runtime version manager to install node.js
published: true
description: Introduction to using "asdf", multiple runtime version manager tool
tags: asdf, node, npm
---

[asdf](https://asdf-vm.com/) is a runtime version management tool. It is similar to other tools such as rbenv (for ruby), nvm (for node), goenv (for golang).

Those tools focus on one language runtime, on the other hand asdf covers most of those language runtimes. Using asdf, you don't have to install each runtime version manager tool one by one, just asdf is enough.

Install asdf via brew:

```bash
brew install asdf
```

Add node.js plugin for asdf:

```bash
asdf plugin-add nodejs
```

Install node.js latest version and set it on a global context: 

```bash
asdf install nodejs latest
asdf global nodejs
```

You can specify a version instead of "latest":

```bash
asdf install nodejs 19.3.0
```

Check node.js and npm versions (versions depend on your environment):

```bash
$ node -v
v19.3.0
$ npm -v
9.2.0
```

That's all!
What is e.defaultPrevented and why library authors MUST use it
Tags: javascript, events, library
Published: 2023-01-06 12:58:00

`Event#defaultPrevented` is, as per [MDN](https://developer.mozilla.org/en-US/docs/Web/API/Event/defaultPrevented), a flag available on an event to know whether its default action was prevented (regardless of whether `Event#preventDefault` was called, but calling it will set the flag to `true`).

Why do library authors need to use it? Because a listener added by the user calling `e.preventDefault()` will not prevent your listeners from being called.

[`@dogstudio/highway`](https://github.com/Dogstudio/highway) is one such library that doesn't check for that, and thus preventing the default behavior of an anchor will not prevent further navigation.

Using `e.defaultPrevented` is here to ensure everyone can safely add listeners and execute them only if they should.

Should browsers make the check for you? Maybe, but it might get freedom away for some use cases. In the meantime, please check for the flag.
type of NaN === “number” কেনো বা কি?
Tags: javascript, beginners, programming, react
Published: 2023-01-06 12:57:39

এটি একটি স্পষ্ট ত্রুটি। NaN (Not a Number) এর ধরন “number” হবে না। এটি একটি বিশেষ সংখ্যা যা প্রতিটি অন্য সংখ্যা এবং সংখ্যার সাথে যোগফলও হিসাব করতে পারে না। এটি একটি সংখ্যার সাথে যোগফল হিসাব করার সময় উত্পন্ন হওয়া একটি ত্রুটির সংখ্যা। এটি একটি সংখ্যার সমান হওয়ার জন্য স্পষ্ট নয়, তাই এটি “number” ধরন হিসাবেও পাওয়া যাবে না। এটি স্পষ্ট ভাবে একটি “NaN” ধরন।

যেমনঃ
`console.log(typeof NaN);   // "number"
console.log(NaN === NaN);  // false
console.log(NaN == NaN);   // false
`

এখানে, typeof NaN কমান্ডটি রান করার সময় "number" হবে আউটপুট, যা স্পষ্ট ভাবে ত্রুটি। তবে, NaN সংখ্যার সাথে যোগফল হিসাব করার সময় NaN এর মান সঠিকভাবে সংজ্ঞায়িত হবে না। এর জন্য NaN এর মান সঠিকভাবে পরীক্ষা করার জন্য isNaN ফাংশন ব্যবহার করা হয়।

`console.log(isNaN(NaN));   // true`