teleren/devto huggingface dataset:
Release 0.3 - Internal
Tags: github, javascript, node, community
Published: 2022-11-18 21:05:56

This was the first commit for this release I contributed to, but it took a while to finish since me and some others were building  a completely new website from scratch. Safe to say we can expect much more in the future. The website is called **[My Photohub](https://github.com/humphd/my-photohub)**. 

###Steps
**No. 1:**
I first started by creating a base line of what the website should look like, any form of padding needed. I then started researching for any open source or `node_modules` that could be used. the first one I cam across that took my interest was called [Fancybox](https://fancyapps.com/docs/ui/fancybox/). It was relatively simple to use. Though what I did not check was when it was last updated. Turns out, Fancybox has not been updated for four years, and I was recommended to take a more modern version. 

**No. 2:**
After doing some research on what was recommended I decided to use **[PhotoSwipe](https://photoswipe.com/getting-started/)** as a base for the gallery view. It took a bit of time for me to understand how the syntax worked, but eventually I understood. It was that the dimensions of the photos has to be inputted a certain way for them to fully fit within the gallery pop-up.

I then deployed it statically, which took a lot of time because I didn't understand the concept of a static page fully. So it took a while, and a lot of questions to understand how to let parcel bundle it properly to be deployed.

I was then requested to change to allow for complete fullscreen capabilities. This is due to the fact that using a mobile IOs device would cause double image. It took a bit of time but this is the result of the work:
[Test Gallery](https://lostbutton.github.io/my-photohub/)

**No. 3:**
It was at this point where I had to start communicating with the other contributors to the repository. It was due to the fact that three of us previously had a `package.json`, `package-lock.json` each and that would cause conflicts around each other.

So what we had to confirm was to create a separate pull request with only those `package.json` and `package-lock.json`. And then remove the package.json from the rest of our files before we fully committed.
[Initial Package Implimentation](https://github.com/humphd/my-photohub/pull/15)

###Thoughts
This was extremely time consuming, but otherwise puts into perspective how long it would takes to merge into a single repository. But that only means this is more experience for those of us participating. I as a contributor have also to take account for the other programmers codes. Other times, I was given their code and had to build around it, this time, we had to build around each others code, at the same time.
Internal Code Review -2 & 3
Tags: react, opensource, github, javascript
Published: 2022-11-18 21:05:42

Continuing my code reviewing, in the same repository as before I another issue popped up and being the person that I am, I took a shot at it.

###Review
**No. 2:**
I will be honest, I had quite the issue with this one, because there was not much that I could see wrong with the code. Even when running ESLint through I couldn't see much. I had a couple issues when trying to run the server because I thought be had to build a template, but that wasn't the case.

After consulting with the author, apparently all I had to do was  `npm install` and `npm run start`. So after doing that the server runs successfully. What I initially saw was that the list of data types within the drop in box was being cut off. But there was no documentation on how to modify the values of the box. Even trying to modify his css file did not work, so there was no real way of making the box bigger or modifying the dimensions of the text.

![List of data types being cut off](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/3yuj9e267mnxicg56yyp.PNG)

**No. 3:**
My Final code review was also in the same repository. There was not much code, but it from what I saw there was an issue that was pointed out in my code, so I thought I would recommend to them as well. Instead of importing from a CDN, they would import it from `node_modules` instead. because importing from an `HTTP` is still considered experimental according to the `node.js` documentation.
You can read more on it [here](https://nodejs.org/api/esm.html#https-and-http-imports).

###Thoughts
Overall, I enjoyed this part of the assignment because it allowed me to review and check other students' code while also providing me with real-world experience with reviewing pull requests. The process of reviewing a pull request is critical because it ensures that only the best code is pushed into the main branch.
Internal Code Review - 1
Tags: javascript, opensource, testing, github
Published: 2022-11-18 21:05:26

Reviewing code is not really my strong suit. It takes a lot of time and effort, something I lack. But I knew it was an essential tool to programmers, taking in and considering better alternatives for code, as well as optimizing it. So I had to push through, and eventually I found several errors within my first review:

###Review
My first ever code review, I decided to do within [my-photohub](https://github.com/humphd/my-photohub). I reviewed a fellow students code that being [SerpentBytes](https://github.com/SerpentBytes). I tried nitpicking at the small details. 

After that, I then decided to clone his code locally via the use of the HTTPS cloning and I couldn't really find anything that caught my eye. So I decided to use ESlint for any syntax. ESLint found several, one of which was an Unused import.

After I submitted what I found the author of the pull request contacted me to help him test out the new version after he had made the changes. He walked me through getting my _personal access tokens_. It took a while because I did not have `gh_` before my token name. Which then caused me to have an `error 400` being that it was an invalid request.

So after getting that sorted out, when I added the proper credentials with an access token that does begin with `gh_`, I finally got a passing message 200. He then asked me to check my GitHub if a repository has been created or not. When I checked, a new repository had been created in my account.

He then asked me to re-input the access token so I did as he told. It was to check whether you can use the same access token twice. Tested it out, and a new repository had been created. So it was working completely as intended.

#### Thoughts 
It was great to work collaboratively on these issues as an open source community. I learned a lot from reviewing other people's code, and it was interesting to see how everyone tried to approach similar tasks in different ways. Overall, I hope that these reviews will help to improve the code quality in the future.
The importance of using moderns tools with Unity
Tags: unity3d, gamedev, csharp
Published: 2022-11-18 21:05:00

Programmers work with various tools every single day. Starting from the very low-level parts of software, such as operating system and finishing somewhere little higher around modern IDEs and other time-saving programs.

There's no discussion that every software engineer uses text editor of some sort. While some use old school editors such as Vim or Notepad++, others tend to lean towards slightly newer software, which generally offers more modern and handy tooling.

When it comes to using IDEs (or text editors) with Unity, there is definitely a vast amount of software to choose from. The most popular IDE to use with Unity is probably Visual Studio 2019, which comes preinstalled with the first Unity version you download. 

Other very popular IDE to use with Unity must be JetBrains Rider. An extremely robust piece of software, which helps you speed up your development process. I've been personally using Rider with Unity close to a year now and it's been such a time-saver.

![PC Monitor](https://images.unsplash.com/photo-1523800503107-5bc3ba2a6f81?ixlib=rb-4.0.3&ixid=MnwxMjA3fDB8MHxzZWFyY2h8MTR8fHByb2dyYW1taW5nfGVufDB8fDB8fA%3D%3D&auto=format&fit=crop&w=900&q=60)

The wake up call, which I've got from using Rider extensively for almost every day of the last year, was the importance of using moderns tools. To be fair, while working in VS or VSCode, I've only used a little amount of tools provided by the software. This came to haunt me with countless hours of debugging foolish mistakes, which were simply caused by my ignorance of the tools I've been provided with.

I've started using few debugging tools, but primarily smaller features, such as the godlike **Refactor This** command, which saves so much effort and time. With this command, you can, for instance, rename any class or function (and much more). The great thing about this is, that it renames all dependencies (or specifically usages), so you don't need to go through all of your code line by line and find it yourself.

This is a really tiny portion of features a modern IDE can offer. The important thing is to avoid the crucial mistake I've done, which was not using these to a full extent and thus making things harder for myself. Use every bit of tech you can and make things easier for yourself. It will definitely make the process of development a tad more enjoyable.
Facing a problem with code.
Published: 2022-11-18 20:58:36

I am facing a problem with a code in android studio. I am unable to select "progress" from the drop down menu, which should complete the code. All I can select is Gone or Pav, but this doesn't work. 

Here is the code
Val rand=Random()NextInt.(Seekbar.Gone)
resultsTextview. text=rand.tostring()
Twitter "bad" Situation
Published: 2022-11-18 20:42:39

Twitter's offices abruptly shut down as hundreds of employees refused to continue working under Elon Musk's new vision for the social platform.

The CEO asked Twitter employees to either commit to an _“extremely hardcore”_ culture at the company that involves _“long hours at high intensity”_ or leave with severance. Anyone who did not sign the pledge by 5pm (ET) on Thursday would receive three months of severance pay.

Overnight it was reported that "lots" of employees had not signed up for Elon Musk's Twitter 2.0 hardcore edition.

Before the deadline, Musk and his advisers held meetings with “critical” Twitter employees in an attempt to dissuade them from leaving. He also seemed to retreat on his stance on not allowing people to work from home in confusing messages about the company’s remote work policy.

Earlier this month, Musk fired executives, slashed off half of the workforce, and fired any remaining staff who dared to bruise his ego on Twitter.

Hashtags like #RIPTwitter, #GoodbyeTwitter and #TwitterOFF were the top trending hashtags among the users of the social network.

Musk has tried to mitigate the damage by bringing engineers and managers from his other companies, but the future of how Twitter will maintain its ability to handle misinformation and operate day-to-day is unclear as the thousands of employees have left in such a short amount of time.

> _“There is no longer even a skeleton crew manning the system. It will continue to coast until it runs into something, and then it will stop.”_

a former employee told the **_Washington Post_**

> _"I think when the dust clears today, there's probably going to be less than 2,000 people left.”_

Other former employee told to **_BBC_**

> _"The manager of that team, his manager was terminated. And then that manager's manager was terminated. The person above that was one of the execs terminated on the first day. So there's nobody left in that chain of command.”_

Another person said they had resigned even though they had been prepared to work long hours.

> _"I didn't want to work for someone who threatened us over email multiple times about only exceptional tweeps should work here when I was already working 60-70 hours weekly”_

Despite the turmoil at the company, Musk tweeted on Friday:

{% embed https://twitter.com/elonmusk/status/1593455727611215872 %}

Before Musk took control of Twitter the company had more than 7.000 staff. The firm also reported to have employed thousands of contract workers, the majority of whom are understood to have been fired.

Musk seemed unconcerned about reports that Twitter was on the brink of shutting down

{% embed https://twitter.com/stoolpresidente/status/1593450747454177280?s=20&t=sWbvSISl5abTkKFs08_Ihg %}

{% embed https://twitter.com/elonmusk/status/1593453455972057090?s=20&t=sWbvSISl5abTkKFs08_Ihg %}

Later on he tweeted a meme showing a gravestone with the Twitter logo on it.

{% embed https://twitter.com/elonmusk/status/1593459801966538755?s=20&t=TfKqGLWYHPia6aB4CEHIsQ %}

How are you feeling about Twitter potentially shutting down?
Regions, availbility zones, edge points in AWS (Short notes about clouds #2)
Tags: aws, beginners, cloud, devops
Published: 2022-11-18 20:38:37

**Regions**
Region is a place where AWS has data centers but region IS NOT a data center. It is a collection of availibity zones. Most of regions consists of 3 availibity zones.

**How to choose the best region for us?**
1. Distance

    First of all, we have to look how close  the region is for our users.  
2. Price list

    The differences between regions are about a few percentages. 
3. Compliance problems

    For instance - when we have financial company sometimes we are obligated to storage data in EU.
4. Functionalities

    Not all the services are availale in all regions. Especially it touches the newest functionalities.
    

**What is availibity zones?**
AZ is the collection af data centers. How many? AWS does not share it.  1 Availibity zone could be 1 data center or many. They are independent centers several dozen kilometers apart because we want to have secured data, systems etc. If we have problem with 1 availibity zone, it should not effect on others availibity zones. The best practice is turning on a few AZs for our applications, to make sure they are gonna be fail-safe.

**Points of Presence(POPs, edge points. access points)**
All other the world we have around 400 POPs. They are additional element of infrastructure for acceleration delivering content to end users.
DROPDOWN HTML & CSS
Published: 2022-11-18 20:16:19

## [Dropdown Menu with HTML & CSS](https://www.avabucks.it/)


View more on [BoxCoding](https://www.avabucks.it/)


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


**HTML:**
```
<div class="context">
    <a class="dropdown">Dropdown<i class='bx bx-chevron-down'></i></a>
    <ul class="hidden">
        <li><a href="#"><i class="bx bx-plus"></i>New tab to the right</a></li>
        <li class="divisor"></li>
        <li><a href="#"><i class="bx bx-save"></i>Save</a></li>
        <li><a href="#"><i class="bx bx-printer"></i>Print</a></li>
        <li><a href="#"><i class="bx bx-undo"></i>Undo</a></li>
        <li class="divisor"></li>
        <li><a href="#"><i class="bx bx-comment"></i>Comment</a></li>
        <li><a href="#"><i class="bx bx-expand-horizontal"></i>Inspect</a></li>
    </ul>
</div>

```
**CSS:**
```
/* ===== Boxicons CSS ===== */
@import url("https://unpkg.com/boxicons@2.1.1/css/boxicons.min.css");

.context {
    position: relative;
}

.context .dropdown {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 220px;
    gap: 4px;
    background-color: rgb(0, 0, 0, 0);
    border: 1px solid rgb(0, 0, 0, .1);
    cursor: pointer;
    padding: 12px 20px;
    border-radius: 10px;
    transition: .3s;
}
.context .dropdown:hover {
    background-color: rgb(0, 0, 0, .1);
    border: 1px solid rgb(0, 0, 0, 0);
}
.context .dropdown i {
    margin-top: 2px;
    font-size: 1.3em;
    pointer-events: none;
    transform: rotate(0);
    transition: .3s;
}
.context .dropdown i.rotate {
    transform: rotate(180deg);
}

.context ul {
    position: absolute;
    left: 50%;
    transform: translate(-50%, 10px);
    opacity: 1;
    width: 100%;
    padding: 0;
    border-radius: 10px;
    border: 1px solid rgb(0, 0, 0, .1);
    color: rgb(20, 20, 20);
    list-style-type: none;
    animation: fade-in-context .3s;
}
.context ul li a{
    display: flex;
    align-items: center;
    color: #000;
    text-decoration: none;
    width: 100%;
    padding: 14px 20px;
    box-sizing: border-box;
    border-radius: 7px;
    cursor: pointer;
    user-select: none;
    transition: .3s;
    background-color:rgb(200, 200, 200, 0);
    font-size: 1em;
}
.context ul li a:hover {
    background-color: rgb(0, 0, 0, .1);
}
.context ul li a i {
    color: rgb(20, 20, 20, .7);
    font-size: 18px;
    margin-right: 10px;
}
.context ul .divisor {
    width: 100%;
    height: 1px;
    background-color: rgb(100, 100, 100, .2);
}

@keyframes fade-in-context {
  0% { transform: translate(-50%, 0); opacity: 0; }
  100% { transform: translate(-50%, 10px); opacity: 1; }
}

.context .hidden {
    display: none;
}
```
**JavaScript:**
```
const dropDowns = document.querySelectorAll(".dropdown");
dropDowns.forEach((dropDown, index) => {
    dropDown.addEventListener("click", handleOnClickDropDown);
});
function handleOnClickDropDown(e) {
    e.target.parentNode.children[1].classList.toggle("hidden");
    e.target.children[0].classList.toggle("rotate");
}
```

View more on [BoxCoding](https://www.avabucks.it/)
Reflect on Pull Request code review
Published: 2022-11-18 14:12:26

This is my first-time reviewing code on Github. It was actually quite fun to read others' code because I was scrutinizing the code suspiciously while I was reading others' code, and through this inspection of code, I realized that it is not easy to do code reviews than writing code because doing code review requires us to not only know how the functions should be implemented but we also need to reading others' code and trying to understand them. On top of that, we also need to know the best practice for the code we review, which requires us to have somewhat experience in this field. However, since we can't think about every aspect of our code when we are writing them, we might make mistakes or not perform the best practice, this is the scenario where code review becomes very important for keeping a good standard in the code we submit. 

## What did I review?
1. Telescope 
Link: https://github.com/Seneca-CDOT/telescope/pull/3762/files/87742e87eac0b136f6f53b0c38c2679f03317abd
This is a PR made by Piotr to modify the documentation to provide a solution for data not showing up after the project is set up. This problem was found by me and Piotr while we are trying to work on the issue [3639](https://github.com/Seneca-CDOT/telescope/issues/3639). In this code review, Piotr updated the documentation for specific detailed steps we need to do after initializing the project in our local environment. I found at the end of the document he modified, a generalization of the problem and solutions is mentioned, however, the fact that the parser needs to be restarted after `db:init` was not mentioned, so I made a code review on this trying to amend it.

2. MyPhotoHub
Link: https://github.com/humphd/my-photohub/pull/9/files/f65ac86f3321207953d66b02c9b9fff1942828f1
This PR was made to make an initial implementation for this project. In this project, I found that the Regular Repression that matches a parameter was hard-coded and has occurred more than once. I think this might not be a good practice to hard code it on every occurrence since it's not future-proof when the regular expression needs to be changed. If this Regular Expression could be referenced from a variable or configuration file, it would make the future changes on it way less headache.
Git & Github  
Published: 2022-11-18 19:53:42

Git & Github
 
Git is a memory card for code. It records the changes made to the code over time in a special database called repository. Git is a distributed visual control system, which means everybody has a copy of the project with its history on their machine. Git is the most popular visual control system in the world because it is free, open source, fast and scalable.
 
Github is a platform where the world builds software. It is a place where online copies of Git repositories are stored.
Ternary Operators for App with two User Types
Published: 2022-11-18 18:26:02

I created an app where users are either a farmer or consumer

```javascript
{!user.producer?
        <h1>Favorite Producers</h1>
      :<>
      <h1>Consumer Analytics</h1>
      <SalesByMonth user={user} partialOrderComplete={partialOrderComplete} myOrders={myOrders} myOrdersOut={myOrdersOut}/>
      </>}
```
How to host discord bot 24/7 using Heroku
Published: 2022-11-18 19:45:26


Hey everyone, in this quick tutorial I'm going to show you how to host your discord bot 24/7 for free using Heroku.


Hhh What you'll need: 

-A discord bot (duh)
-Some knowledge of Javascript and the Discord.js library 
-A Heroku account (sign up here: https://signup.heroku.com/) 

Once you have all of that, head over to your Heroku account and create a new app. Give it a name (this can be anything) and set the region to whichever is closest to you. After that, select "Create App".

Once the app has been created, head over to the "Deploy" tab and scroll down to the "Manual Deploy" section. Select the branch you want to deploy from (usually this will be "master") and click "Deploy Branch". Now, wait for the deploy to finish.Once it has finished, head over to the "Resources" tab and click "Add a resource". Search for "Heroku Scheduler" and select it. Once you've added the Scheduler, head over to the "Settings" tab and click "Reveal Config Vars". You will need to set two config variables: BOT_TOKEN and CLIENT_ID. The BOT_TOKEN is your bot's token (you can find this in the discord developer portal) and the CLIENT_ID is your Discord application's client ID (also found in the developer portal).After you've set those, head over to the "Heroku Scheduler" tab and create a new job. In the "Command" field, type in "node bot.js" (or whatever your main file is called) and in the "Frequency" field, select how often you want your bot to be restarted. I usually just set mine to "Daily". After that, click "Add Job" and you're all done! Your bot should now be up and running 24/7.

If you have any questions, feel free to leave them in the comments below and I'll try to get back to you as soon as I can. 


As always, thanks for reading and I hope this helped you out.

![Image.png](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/34furj6i5xm6csf6m9pf.jpg)
React's idea is to reduce coupling and increase cohesion <?>
Tags: react, webdev, javascript, programming
Published: 2022-11-18 19:17:57

Coupling:
The degree to which the program module relies on each of the other module.
Like,
if you want to change a code or to fix a bug in any one module, let it be class, div, we have to go to other parts of the code base to wherever we have used the same one, to change it. Coupling makes software hard to maintain.
React's idea is to reduce this by using COMPONENT based development.

Cohesion:
The degree to which the elements of a module belong together.
My free search API
Tags: api
Published: 2022-11-18 19:09:44

This story begins, with a need for a project, where my contractor needed to carry out searches on google but did not want to pay for an api, and so I went to find a way, now with the project finished and with this api developed I decided to share it with the world this simple API.

LINK TO API => [Google It Cloud](https://rapidapi.com/ortnauiann-ErLiOz2Qih/api/google-it-cloud)

I'm very happy to be able to give back to the DEV community a little bit of all the affection they've already given me, this api means a lot to me, I had to evolve as a DEV to be able to make it


If you found the api useful, I would love to receive a coffee

[buymeacoffee](https://www.buymeacoffee.com/iannocs)