teleren/devto huggingface dataset:
Interfaces in object oriented programming
languages and prototype-based languages
Tags: interfacesinoop
Published: 2021-01-29 14:28:52

<h3><b>Definition of interface in OOP:</b></h3>

interface is a programming structure/syntax that allows the computer to enforce certain properties on an object (class)

<h3><b>Benefits of using interfaces in OOP:</b></h3>

For OOP, using the interface you benefit from: The API is more clear to the user. Implementation detail can be hidden from the user, less confusions and easy swapping between implementations. Unit tests can detect regressions and benefits from mocking. Easier to maintain backward compatibility: keep the legacy interface working while building new ones.

<h3><b>why JavaScript does not really use interfaces :</b></h3>

Interfaces are a contract that defines what classes should look like and JavaScript doesn’t use classes to create objects 

<h3><b>How objects are created with JavaScript:</b></h3>

<h4><b>Defining an object:</b></h4>

let object={
name:values
}

<h4><b>Accessing object property:</b></h4>

objectName.propertyName

<h4><b>Example:</b></h4>

var person = {
  firstName: "John",
  lastName: "Doe",
};

<h4><b>Access by:</b></h4>
person.lastName;

<h3><b>What strict mode is in JavaScript:</b></h3>

Strict Mode is a new feature in ECMAScript 5 that allows you to place a program, or a function, in a “strict” operating context. 

<h3><b>Why you would use  strict mode is in JavaScript:</b></h3>

JavaScript was designed to be easy for novice developers, and sometimes it gives operations which should be errors non-error semantics. Sometimes this fixes the immediate problem, but sometimes this creates worse problems in the future. Strict mode treats these mistakes as errors so that they're discovered and promptly fixed.

<h3><b>TypeScript definition:</b></h3>

TypeScript is a typed superset of JavaScript ,it makes JavaScript a statically-typed language instead of a loosely-typed language. 

<h3><b>how TypeScript  can be used to create interfaces:</b></h3>

One of TypeScript’s core principles is that type checking focuses on the shape that values have. This is sometimes called “duck typing” or “structural subtyping”. In TypeScript, interfaces fill the role of naming these types, and are a powerful way of defining contracts within your code as well as contracts with code outside of your project.

<h3><b>How TypeScript  enforce strict typing in JavaScript:</b></h3>

TypeScript stands in an unusual relationship to JavaScript. TypeScript offers all of JavaScript’s features, and an additional layer on top of these: TypeScript’s type system.

For example, JavaScript provides language primitives like string, number, and object, but it doesn’t check that you’ve consistently assigned these. TypeScript does.

<h3><b>Reference</b></h3>

- www.cs.utah.edu/~germain/PPS/Topics/interfaces.html</a>

- https://www.w3schools.com/js/js_objects.asp

- https://www.typescriptlang.org/docs/handbook/interfaces.html

- https://www.typescriptlang.org/docs/handbook/typescript-in-5-minutes.html

- https://www.typescriptlang.org/

- www.geeksforgeeks.org/strict-mode-javascript/
Why Buy Rectangular Dining Table For Your Home?
Published: 2021-01-29 14:05:50

The primary attraction in the dining rooms is the dining tables. It is necessary, therefore, to choose it wisely. There are many forms of dining table available on the market, but there are some benefits to the rectangular dining table over others, let's know about it below -

Encourages Communication
Square and circular dining tables will accommodate the same number of people as a rectangle, but they are far above one another. The larger table styles would make it more difficult for comfortable conversation and would interrupt comfortable dinner parties. A rectangular table on either side brings the guests closer together.

Best For Less Space
In new homes, many dining rooms or seating areas are not as enormous as they used to be. Therefore, if you have little space, you would need to match the bench as best as you can. There are smaller rectangular shaped tables than most other alternatives, so in a smaller room, it works well. It can easily expand to fit more individuals as needed, too.

Offers Space
A rectangular dining table, owing to its long and narrow shape, provides space for other furnishings in the dining section. In a smaller space, it is also useful for sideboards and side tables, and built-in cabinetry. A circle or square shape does not leave as much space to place storage and serving items for larger groups that you would need along with any given wall.

Wide Variety of Designs
Since the most common style is the rectangular dining table, separating types and choices would be much easier to choose from. This usually means that you can get better deals and more opportunities. With more competition between models and manufacturers, the budget-minded shopper should be pleased.

From the small dining table to larger ones, buy every type of rectangular dining table from thehomedekor.in at the best price. Read more:  https://www.thehomedekor.in/dining-table
https://www.thehomedekor.in/
a Brief of My Blog
Tags: javascript, python
Published: 2021-01-29 14:28:12

This blog will records my progress while  I am learning JavaScript, Python and English language. The post will be concise and may be lack of details, because the main purpose in creating this is just for me to recall what I've learned, but still I'm gonna make this as easy as possible to others can understand.

This is gonna be long journey of mine, so I hope I can consistent with what I've started. and see you in the next post.

The next post will be about JavaScript and why I wanna  explore it seriously.
Day 36 Of 100DayOfCode: Birthday Dictionary
Tags: 100daysofcode, beginners, codenewbie, python
Published: 2021-01-29 14:22:56

This is my 36th day of #100DaysOfCode and #python. I practiced database using python. Made some table. Completed some assignment.
Tried to write some code in different topic.

I tried to write one birthday dictionary. In which we put  name of persons as a key and birthday  dates as a value. 

# Birthday Dictionary
At first we importing time library. And there is `Birthdays` as a dictionary name. There are four key and value. Then there is `time.sleep(1)` which help to appear letter inside print in 1 sec. My rest of code is given below.

```python
import time
Birthdays ={
    "Durga Pokharel": "30/6/1997",
    "Barsha Bhandari": "28/10/1998",
    "Crystal Bhattarai": "24/2/2015",
    "Shubekshya Pandey":"13/2/2012",
}
print("Welcome to the Birthday special. Please wish  person who have birthday ! We have the birthdays to:")
time.sleep(1)
for x in Birthdays:
    print(x)
    time.sleep(0.7)
choice= input("\nWho's birthday do you want to look up?")

if choice in Birthdays:
    print("The birthday of {} is: ".format(choice))
    print(Birthdays[choice])
``` 
Output of the code is,
```python
Welcome to the Birthday special. Please wish  person who have birthday ! We have the birthdays to:
Durga Pokharel
Barsha Bhandari
Crystal Bhattarai
Shubekshya Pandey

Who's birthday do you want to look up?Durga Pokharel
The birthday of Durga Pokharel is: 
30/6/1997
```
<blockquote class="twitter-tweet"><p lang="en" dir="ltr">Day 36 Of <a href="https://twitter.com/hashtag/100DaysOfCode?src=hash&amp;ref_src=twsrc%5Etfw">#100DaysOfCode</a> and <a href="https://twitter.com/hashtag/Python?src=hash&amp;ref_src=twsrc%5Etfw">#Python</a> <br>* More About Database Using Python<br>* Python Dictionary<br> * Python function<br>* Birthday Dictionary<a href="https://twitter.com/hashtag/100DaysOfCode?src=hash&amp;ref_src=twsrc%5Etfw">#100DaysOfCode</a> ,<a href="https://twitter.com/hashtag/CodeNewbies?src=hash&amp;ref_src=twsrc%5Etfw">#CodeNewbies</a>, <a href="https://twitter.com/hashtag/beginner?src=hash&amp;ref_src=twsrc%5Etfw">#beginner</a> <a href="https://t.co/4LdzrTa7Mx">pic.twitter.com/4LdzrTa7Mx</a></p>&mdash; Durga Pokharel (@mathdurga) <a href="https://twitter.com/mathdurga/status/1355154722823548931?ref_src=twsrc%5Etfw">January 29, 2021</a></blockquote> <script async src="https://platform.twitter.com/widgets.js" charset="utf-8"></script>
Top VS Code Extensions For Absolute Frontend Beginners
Tags: vscode, frontend, beginners, extensions
Published: 2021-01-29 14:20:22

![Alt Text](https://dev-to-uploads.s3.amazonaws.com/i/uuupppgx0lkf44yso2sy.jpg)

Microsoft's Visual Studio Code (VS Code) is one of the best code editors out there. Not only does its intuitive user interface make coding a little less crazy for newbie developers, but it's also got a bunch of other functionalities that set it apart from among the stock. Awesome plug-ins being one of them. So, here are ten VS code plug-ins that'll make your coding experience as a beginner Front-end Developer really smooth. 


###1. Live HTML Previewer
Live HTML Previewer allows you to view your HTML/CSS codes live while getting your hands on the code editor. This will allow you have a real-time visual representation of whatever you're coding. And comes with the huge advantage of allowing you to inspect, edit or delete any section of the page you didn't like irrespective of the code behind it. After all, what matters most at this stage is whether you really can deliver basic design and development objectives. 

###2. Live Server 
Live Server is an amazing VS code extension that makes the whole process of setting up a server really easy. Oftentimes, you'd want to test your dynamic and/or static web pages and the local development server that Live Server allows developers to run will always come in handy. What is more, it supports HTTPS, proxies and enables really powerful customizable features on your project.

###3. Live SaaS Compiler
SaaS is often called "CSS with superpowers'' and while the debate of whether that title absolutely belongs to SaaS or not over yet on its own right, SaaS is an amazing tool to master. As a CSS preprocessor, SaaS helps you write better, cleaner CSS code. And the Live SaaS Compiler makes the process seamless for you. With this Live SaaS Compiler, you don't need to download/install nodejs or npm on your machine. It takes care of all the stress for you. 

###4. Better Comments
As a beginner, you'd probably want to keep notes, mark your To-do list and leave comments that'll help you make sense of your work environment. That's exactly what Better Comment does for you. Once installed, it helps you sort your HTML comments into categories for easy reference. 

Like my picks? Let me know in the comment section below. Also, feel free to add your best VS Code extension to the list and why you love it.
Resources for Effective Dark-Mode on OSX
Published: 2021-01-29 14:18:22

A quick roundup of a few resources I found useful while setting up an automated dark/light-mode workflow for my terminal app (iTerm2) and code editor (VSCode).

No tutorialized content, just a bunch of links, so lets get started.

- [iTerm2 Auto Switch Theme Script](https://gist.github.com/elis/672c56a2559a6b24cf56145f67962de0) - Automatically switch themes when OSX changes from/to dark-mode - a few [more details (and the original script) in the comments here](https://gist.github.com/jamesmacfie/2061023e5365e8b6bfbbc20792ac90f8)
[![Alt Text](https://dev-to-uploads.s3.amazonaws.com/i/npldg6wdmh2qpeozmonf.gif)](https://gist.github.com/elis/672c56a2559a6b24cf56145f67962de0)

- [iTerm2 Color Themes](https://github.com/mbadolato/iTerm2-Color-Schemes) - A large collection of iTerm2 color themes to pick from
[![Alt Text](https://dev-to-uploads.s3.amazonaws.com/i/i25q67vm51i65w2et7ux.png)](https://github.com/mbadolato/iTerm2-Color-Schemes)

- [VSCode Auto-Dark-Mode Extension](https://marketplace.visualstudio.com/items?itemName=LinusU.auto-dark-mode) - Sync VSCode to automatically switch color themes when OS changes dark mode
[![Alt Text](https://dev-to-uploads.s3.amazonaws.com/i/aijekgslhpyj1bsqqgho.png)](https://marketplace.visualstudio.com/items?itemName=LinusU.auto-dark-mode)

- [VSCode Auto Switch Themes Extension](https://vscodethemes.com/) - An immense collection of VSCode themes arranged in a convenient way
[![Alt Text](https://dev-to-uploads.s3.amazonaws.com/i/gq15ymwib0h9erevr2cy.png)](https://vscodethemes.com/)

- [VSCode Themes Switch Extension](https://marketplace.visualstudio.com/items?itemName=JanBn.vscode-theme-switcher) - I've been using this (and other similar) extension to manually switch between themes in VSCode - bound to `Option + T` two switch between my dark/light modes, very useful and convenient
[![Alt Text](https://dev-to-uploads.s3.amazonaws.com/i/26hfugr4cg0fkai8jyqf.png)](https://marketplace.visualstudio.com/items?itemName=JanBn.vscode-theme-switcher)

- [OSX NightOwl](https://nightowl.kramser.xyz/) - I'm using NightOwn to manually switch OSX dark/light mode - it's convenient as it allows to middle-click on the taskbar icon to change the modes, and in combination with the above scripts and extensions the dark/light mode transition is quick and convenient
[![Alt Text](https://dev-to-uploads.s3.amazonaws.com/i/8doue77nqmv80pxcygq5.jpg)]((https://nightowl.kramser.xyz/))
Disabling foreign key constraints in MySQL
Tags: mysql, database, laravel
Published: 2021-01-29 14:02:24

I have recently made a backup of our Laravel Vapor MySQL database before a temporary deployment on our staging environment. 

When I wanted to restore the MySQL database using (https://dbeaver.io/)[DBeaver], an open source GUI utility, I encountered an error because tables were referenced by foreign key constraints :

```mysql
ERROR 3730 (HY000) at line 104: Cannot drop table 'articles' referenced by a foreign key constraint 'publications_article_id_foreign' on table 'publications'.
```

Foreign Keys offer you the option to have updates and deletes cascade from the parent (reference) table to the child table.  I could have manually dropped every table in our database prior to restoring the data, but I instead decided to follow this simple trick :

Before restoring the data, I executed the following MySQL command :

```mysql
SET FOREIGN_KEY_CHECKS=0;
```

I restored the data successfully and made sure to configure the `FOREIGN_KEY_CHECKS` again :

```mysql
SET FOREIGN_KEY_CHECKS=1;
```

You can also add those commands respectively at the top and bottom of your `.sql` backup file.

Another way to bypass foreign constraints on database restore is to use `DISABLE KEYS` :

```mysql
ALTER TABLE table_name DISABLE KEYS;
```
You can now restore the database.

You should reconfigure `ENABLE KEYS` after restoring the database :

```mysql
ALTER TABLE table_name ENABLE KEYS;
```

Please note that `DISABLE KEYS` only works for MyISAM and not InnoDb storage engine.

Let me know if this article was helpful to you !
Responsive CSS Grid With No Media CSS
Tags: html, css, 100daysofcode, beginners
Published: 2021-01-29 13:51:55

***Hello guys in this tutorial we will create a responsive CSS Grid With No Media CSS***

First, we need to create two files ***index.html*** and ***style.css*** then we need to do code for it.

###Step:1###
**Add below code inside index.html**

```html
<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <title>Responsive Grid Css</title>
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <meta http-equiv="X-UA-Compatible" content="ie=edge" />
    <link rel="stylesheet" href="style.css" />
    <link href="https://fonts.googleapis.com/css2?family=IBM+Plex+Sans&display=swap" rel="stylesheet">
  </head>
  <body>
    <div class="row-outer">
      <div class="container">
        <div class="grid-wrapper">
          <div class="box">Box</div>
          <div class="box">Box</div>
          <div class="box">Box</div>
          <div class="box">Box</div>
          <div class="box">Box</div>
          <div class="box">Box</div>
          <div class="box">Box</div>
          <div class="box">Box</div>
        </div>
      </div>
    </div>
  </body>
</html>
```

###Step:2###
Then we need to add code for style.css which code I provide in the below screen.
```css
* {
  padding: 0;
  margin: 0;
  font-family: 'IBM Plex Sans', sans-serif;
}
body {
    background: #f1f2f3;
}
.container {
    width: 95%;
    max-width: 1160px;
    margin: auto;
}
.grid-wrapper {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(250px,1fr));
    grid-gap: 20px;
}
.box {
    height: 250px;
    background: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    border: 2px solid #4b00ff;
}
.row-outer {
    padding: 50px 0;
}
```

### Auto Responsive Video Output:###
{% youtube E_70KIS4MHo %}

### Auto Responsive Codepen Output:###
{% codepen https://codepen.io/stack-findover/pen/QWdYdQK %}


> <a href="https://blog.stackfindover.com/responsive-css-grid-with-no-media-css/" rel="dofollow">Download source code</a>
How to remove a sensitive file from GitHub
Tags: github, codenewbie
Published: 2021-01-29 13:48:23

Yes! this has happened to most of the people, especially when we are just starting. We accidentally commit sensitive data to GitHub. We forget to gitignore our config file containing database passwords or API keys or jwt secrets. And we immediately start to panic.

This happened to me a couple of days ago. I forgot to ignore my default JSON file that contained my database connection password and jwt secret. I had just gotten a feature to finally work and in the excitement, I immediately committed and pushed to GitHub. I only realized my error when I got a notification from GitGuardian that my latest commit contained secret keys.

If you find yourself in the same position, the first thing you do is change the visibility of the repo. So, if it's a public repo, make it private. This way, you're sure no one else sees the file while you're working on deleting it.

Next thing, if you aren't already in the project folder, cd into it on git bash or whatever terminal you are using. Let's assume my project folder is My-Project and I have a file named secretFile.json I want to delete.

`cd My-Project`

then run the following command. You have to include the path to the file and not just the file name.

```
git filter-branch --force --index-filter \
  "git rm --cached --ignore-unmatch config/secretFile.json" \
  --prune-empty --tag-name-filter cat -- --all
```

replacing config/secretFile.json with the path to the file you want to be removed. In my case, secretFile.json is inside of a folder named config.

Note: The command above deletes the file from your local repository too, so ensure you have copied the content to a notepad or whatever you use before running the command.

Then create and add your file to .gitignore so you don't accidentally push it to GitHub again. You can do that with

` echo "name-of-your-file" >> .gitignore `


` git add .gitignore `

` git commit -m 'add file to .gitignore' `

Once you are satisfied with your changes, you can then push them to GitHub

` git push origin --force --all `

And that's it! Your repo history is clean without any trace of your sensitive file.

Thanks for reading.
Are you a passionate coder?
Tags: django, github, python
Published: 2021-01-29 13:47:36


Micropyramid team welcomes developers to contribute their code to our opensource project Django CRM.
Only the developers have that weapon to build a fantastic experience that people might love.
If interested in our opensource Django project, visit us @ https://github.com/MicroPyramid/Django-CRM
#django #github #developer #experience #team #developers #opensource
The Vue.js 3 Masterclass has launched! Get 45% off during launch week
Published: 2021-01-29 13:22:43

It’s here! The Vue.js 3 Masterclass has launched! 🚀

In the Masterclass, you’ll learn how to build a real-world application from scratch. With over 100+ lessons there will be lots to look forward to including some exciting lessons on: 

- Vue Router 4
- State management with Vuex
- Working with npm packages
- Third-party authentication
- Google Cloud Firestore
- Consuming a REST API
- + many more

Get 45% off The Vue.js 3 Masterclass with the launch week offer 👇
https://vueschool.io/the-vuejs-master-class/
Daily Developer Jokes - Friday, Jan 29, 2021
Tags: jokes, dailydeveloperjokes
Published: 2021-01-29 13:00:30

---
title: "Daily Developer Jokes - Friday, Jan 29, 2021"
description: "Check out today's daily developer joke! (a project by Fred Adams at xtrp.io)"
series: "Daily Developer Jokes"
cover_image: "https://private.xtrp.io/projects/DailyDeveloperJokes/thumbnail_generator/?date=Friday%2C%20Jan%2029%2C%202021"
published: true
tags: #jokes, #dailydeveloperjokes
---

Generated by Daily Developer Jokes, a project by [Fred Adams](https://xtrp.io/) ([@xtrp](https://dev.to/xtrp) on DEV)

___Read about Daily Developer Jokes on [this blog post](https://xtrp.io/blog/2020/01/12/daily-jokes-bot-release/), and check out the [Daily Developer Jokes Website](https://dailydeveloperjokes.github.io/).___
### Today's Joke is...
![Joke Image](https://private.xtrp.io/projects/DailyDeveloperJokes/public_image_server/images/5e12591923cec.png)

---
*Have a joke idea for a future post? Email ___[xtrp@xtrp.io](mailto:xtrp@xtrp.io)___ with your suggestions!*

*This joke comes from [Dad-Jokes GitHub Repo by Wes Bos](https://github.com/wesbos/dad-jokes) (thank you!), whose owner has given me permission to use this joke with credit.*

<!-- 
Joke text:
___Q:___ How do you help JS errors?

___A:___ You `console` them!
 -->
Ensinando o terminal a falar
Tags: powershell, tutorial, beginners, systems
Published: 2021-01-29 12:58:28

Dessa vez vamos fazer uma coisa um pouco mais divertida, utilizar o Powershell para sintetizar voz ou seja, vamos fazer nosso script falar. 

Conseguimos fazer isso utilizando um recurso do sistema, então é importante lembrar que a qualidade da pronuncia vai depender da linguagem instalada no sistema. Exemplo, eu estou usando meu Windows em ingles e passando texto em português para ele ler, o que deixa tudo bem engraçado devido a pronuncia. 

Existem alguns usos interessantes para esse recurso, como deixar os retornos dos nossos scripts mais acessíveis, ao não depender unicamente de ler uma tela para saber o que aconteceu. 
Um outro que já utilizei, é usar isso em conjunto com formas de se comunicar com outros computadores, criando uma espécie de "radio", podemos trabalhar nessa ideia no futuro.

Inicialmente, vamos trabalhar no script base para o recurso: 
{% gist https://gist.github.com/IGDEXE/1744b854f5b60ae5aa3c1110d2b7772e %}

Com esse script, pode passar como parâmetro uma mensagem para que o terminal leia. Mas vamos tentar colocar isso num cenário mais pratico, utilizando ele para uma resposta em um script nosso.

Vamos basicamente pegar nosso script que simula a configuração de um repositório GIT local e vamos adicionar aos retornos escritos, o narrador.
{% gist https://gist.github.com/IGDEXE/2eaa971950fc30e2dcdb69b61d695f4f %}

Com isso, tornamos nosso script mais inclusivo e divertido. 
Eu só não gostei muito da repetição de código com os textos, mas vamos cuidar disso na próxima postagem.
Sitecore MVP!
Tags: sitecore
Published: 2021-01-29 12:56:51

So I got an email Wednesday, and didn't expect to have this information released until today, but it got released yesterday, so...

Seems I got me one of these things:

![Alt Text](https://dev-to-uploads.s3.amazonaws.com/i/d1b65c7rtomf47w4phlo.jpg)

Which means it's this time:

![Alt Text](https://media.giphy.com/media/d5Ea4WNLvEXI7sxl4v/giphy.gif)

Seriously, I'm very honored to get my first-ever Sitecore MVP, and I'm going to work this year to improve my blogging and source contributions to get the award next year too.

Now back to work!
what does this mean?:

import { gql } from "@apollo/client";
^^^^^^
SyntaxError: Cannot use import statement outside a module
Tags: react, graphql, help, mongodb
Published: 2021-01-29 12:51:26

I checked the way I’m using it, but what does this mean?:
‘’’

import { gql } from "@apollo/client";
^^^^^^
SyntaxError: Cannot use import statement outside a module