teleren/devto huggingface dataset:
Digital Clock with python
Tags: python
Published: 2020-12-14 18:42:35

 #datetime #pytz #tkinter
I am still learning python and I am pumped up to get better at it each and every day. I have realized to get better at any language is through creating projects after learning something for example a library. I learnt the date time library and I decided to to create a digital clock in order to sharpen my skills. I decided to share with you guys what I  have created so that some one out there can learn something. The program has GUI(tkinter) where by i implemented dropdown list that has options of time zones using the pytz module.
A user can select a time zone of his or her choice and the current time will be displayed in relation to the time zone. 
Check the code below.
check our code running on youtube
https://www.youtube.com/watch?v=C9Xke1aG7Ww


"""
A digital clock 
->made this project when leaning about the date time module
->I used the pytz module to get different time zones 
->A user can change the time zone by selecting a time zone from the drop down list
->the default timezone used is 'Africa/Nairobi'->
j=0
for i in pytz.common_timezones:
    j+=1
    if i=='Africa/Nairobi':
        break 
print(j-1,i)
Run the above code to get the timezone that 'Africa/Nairobi' belongs
"""
from tkinter import *
from tkinter.font import Font#get the desired font
import datetime
from datetime import datetime
import pytz

win = Tk()
win.title("Digital Clock")
win.geometry("310x200")
win.resizable(False,False)
#current_time = datetime.now(pytz.timezone('Africa/Djibouti')) # get the current time
def my_digital_clock():
    current_time = datetime.now(pytz.timezone(timezone_list.get())) # get the current time from the drop_down list
    time_display=current_time.strftime('%H:%M:%S')
    digital_time_lb.config(text=time_display,fg="red")#updates the label to the current time
    day_display=datetime.now()
    day_display=current_time.strftime('%B,%d:%Y')
    print(str(day_display))
    digital_DAY_lb.config(text=day_display,fg="green")
    #print(timezone_list.set(str(pytz.common_timezones[0])))
    #used strftime() to format the display of the current time
    #%H->hours
    #%M->minutes
    #%s->seconds
    #%B->month name
    #%Y->year
    #%d->day
    #change the time after a specific millisecond
    win.after(80,my_digital_clock)
    
my_font = Font(size=100)
#display the time
digital_time_lb = Label(win,font=("Times new roman",30))
digital_time_lb.pack()
#display the day/month/Year
digital_DAY_lb = Label(win,font=("Times new roman",30))
digital_DAY_lb.pack()
 
timezone_list=StringVar()
#set the default time zone for Nairobi
timezone_list.set(str(pytz.common_timezones[42]))#default timezone is 'Africa/Nairobi'(42)
#used the OptionMenu()->function
drop_down=OptionMenu(win,timezone_list,*pytz.common_timezones)
drop_down.pack()

my_digital_clock()#function call
win.mainloop()
"""
add a label to dislay the time on our screen
the time should change at a pecific time
->display the time zone 
->choose the time zone and display the time
"""
"""
.config()->used to update the label
win.config(text="change")
THANK YOU
NodeJS top 10 things to note when developing
Tags: node, npm, javascript, webdev
Published: 2020-12-14 18:35:41

---
title: NodeJS top 10 things to note when developing
published: true
description: NodeJS 
tags: node,npm,javascript,webdev
cover_image: https://cdn.freebiesupply.com/logos/large/2x/nodejs-1-logo-png-transparent.png
---

### <center>NodeJS top 10 listing</center>
******
I've already been working with node for some time and I have gathered a small listing of things that I (or some web developers) might find important and would be useful to share online.

**Here is a list of the top 10 things to be aware of when using Node:**
**1.** Use nvm whenever possible to make it easier to track multiple node instances in your environment.

**2.** If you are going to use npm for installations behind a proxy, make sure you have the environment settings globally applied on .npmrc for your running instance via `npm config`.

**3.** Do not over-burden your plugin system with a lot of unnecessary features, check the dependencies first on [npm](https://www.npmjs.org) (if avail).

**4.** Use `npm ls | grep "dep@version"`(bash) or `npm ls | findstr "dep@version"`(cmd) to easily filter relevant packages on npm when the installation list grows too large.

**5.** Check for `package-lock.json` files first when you have issue with a package or after running `npm update` to make sure you have non-corrupt modules. Delete `*-lock.json` and files only when dependencies break your npm. Currently `package-lock.json` is overwritten by default.

**6.** Compatibility checks on minor versions for newly added packages are easily applied by using `npm update` instead of `npm install`.

**7.** Do not use `--force` installs before checking for incompatibility between already installed modules, especially when running your build alongside a testing/build platform (e.g. mocha, commonjs or webpack).

**8.** When using raw html rendering via a templating engine such as jade or ejs be sure to properly escape characters in your template file to prevent injected malicious code.

**9.** Make sure you scan your default packages directory for vulnerabilities to keep your installations up-to-date with relevant security changes.

**10.** Node v12+ supports ES6 modules via usage of `"type":"module"` in the `package.json` file or including it as an `*.mjs` extension. Loading is done via `import mod from './modulename'` instead of `require('./modulename')`.
Closures in Javascript PART-1
Tags: javascript, programming
Published: 2020-12-14 18:24:46

*DISCLAIMER: I've written this blog to share with others what I've understood after going through several blogs, articles, videos, etc. So the following written blog might contain some ideas & language influenced by those.*
<hr/>

### Overview
Closures are one of the most asked interview topics & are frequently used in JavaScript for object data privacy, in event handlers and callback functions, and in partial applications, currying, and other functional programming patterns.

### Definition
* A closure is a function bundled together with it's lexical environment. 
* In simple words a closure gives you access from an outer function's scope from an inner function.
* In Javascript, a closure is created every time a function is created, at function creation time.

### Lexical Scoping
The following is an example of *lexical scoping*, where `getName()` has 2 local variables `firstName` & `lastName`.  
It also has a nested method which is accessing these variables of it's other function.  
![carbon](https://dev-to-uploads.s3.amazonaws.com/i/52g5mw7fzrgelzjzo1m8.png)
[JSFiddle Link](https://jsfiddle.net/shivaansh/vLy1b8eh/1/)
Lexical Scoping describes how a parser resolves variable names when functions are nested.

### Closures
Now what happens if we return this nested method and call it from outside?  
![carbon (1)](https://dev-to-uploads.s3.amazonaws.com/i/uhm7uo3z0x7d5ebn9uby.png)
[JS Fiddle Link](https://jsfiddle.net/shivaansh/vLy1b8eh/5/)
It works exactly the same as in previous example.
The catch here is when we return the function, it is returned along with its lexical environment. The lexical environment of the inner function `getFullName` consists of any local variables that were in-scope at the time when closure was created.

#### References:
1. https://developer.mozilla.org/en-US/docs/Web/JavaScript/Closures
2. https://javascript.info/closure
3. https://www.youtube.com/watch?v=qikxEIxsXco
4. https://www.youtube.com/watch?v=71AtaJpJHw0
Class and Functional Components
Tags: react, javascript
Published: 2020-12-14 18:23:37

In React we have two types of components: 1. Functional components 2. Class components
We will learn about both types and also discuss the differences between the two but before we do that we need to know what is a “Component”? A component is a function or class that produces JSX to show the user and handle feedback from the user using event handlers. Now,
let's dive in:

**Functional Components**

Functional components are basically a JavaScript function that produces JSX to show content to the user. It doesn’t have access to the component's lifecycle methods or state. Its only job is to show content to users. Here is an example of a functional component:

```react
const App = () => {
    return <div> Hello World! </div>
}
```
If you are not familiar with ES6 syntax here is the another example of regular function:

```react
function App() {
   return <div> Hello World! </div>
}
```
They both return Hello World!. I prefer to use the arrow function as shown in the first example because it will automatically bind `this`.

**Class Components**

A class component is a JavaScript class that extends from React which has a render method. We can see we did not have a render method defined in the functional component. This is one difference between both components. Just as the functional component, the class component also produces JSX to show content to the user but it can also use the `state` system to update content on the screen using setState and in addition use, lifecycle methods to run code at specific points in time. Here is a simple example of a class component:

```react
class App extends React.Component {
   render() {
      return <div> Hello World! </div>
    }
}
```
There is one more difference between class and function components which is how we pass `props`. In class components we pass props using `this.props` but in function components we simply pass `props`. Let's have a look:

```react
const App = (props) => {
    return <div> My name is  {props.name}! </div>
}

class App extends React.Component {
   render() {
      return <div>My name is {this.props.name}! </div>
    }
}
```
Everything we discussed above was without the hooks system. With the React hooks system, there is much more we can do with functional components but we will not be exploring the hooks system in this blog post. However, I will say this: In the modern React world the hooks system gives more power to functional components and it functions similarly to that of class components.
Solving day 14 of Advent of Code 2020 in JavaScript
Tags: challenge, adventofcode, javascript, video
Published: 2020-12-14 18:23:16

---
title: Solving day 14 of Advent of Code 2020 in JavaScript
published: true
description: JavaScript walkthrough of Advent of Code 2020 (day 14)
tags: challenge, AdventOfCode, javascript, video
series: Advent of Code 2020 in Javascript
---

{% youtube -Ym1pMEyaf0 %}
Nunca é tarde pra começar, não é mesmo?
Tags: beginners, braziliandevs, codenewbie
Published: 2020-12-14 18:22:10

Depois de me formar em produção audiovisual, e antes disso ter desistido de jornalismo, imaginei que apesar da situação precária em que estamos, seria interessante estudar algo diferente, nem que fosse apenas pra me distrair do fato de que eu estava sem emprego e com o futuro extremamente incerto (como a maioria de nós esse ano). 

Estudar programação parecia uma ideia genial, já que minha melhor amiga tem lá pros seus 8 anos de carreira na área e eu teria pra onde correr e tirar dúvidas. Mas comecei sem foco, sem saber pedir e sem aceitar que eu estava prestes a mudar de carreira. 

Deu tudo errado, obviamente. Mas depois de muitas horas chorando e pensando, decidi começar mais uma vez, depois de mais pesquisa, aceitando ajuda e perdendo o medo de errar. Antes achava meio bobo ficar muito feliz colocando um projeto no github que foi feito a partir de um tutorial considerado básico. Mas é incrível! Minha evolução bem ali pra eu ver. 

E agora cheguei num ponto onde quero compartilhar, quero fazer parte da comunidade, quero aprender mais (e tenho tanto pra aprender!), conseguir ajudar alguém que precisa. Acho que no final das contas esse post serve pra dizer: *Oi, meu nome é Ingryd, sou uma nova dev, prazer em conhecer vocês.* :)
I'm joining the DEV hackathon! Here's what I'm going to build 
Tags: hackathon, javascript, dohackathon
Published: 2020-12-14 18:19:42

---
series: DigitalOcean Hackathon
---

We're running a [hackathon with DEV and DigitalOcean](https://dev.to/devteam/announcing-the-digitalocean-app-platform-hackathon-on-dev-2i1k) for December 10 - January 10. This is a great opportunity to force ourselves to build the projects we've been wanting to build.

I'll be spending this hackathon building and [streaming on Twitch](https://twitter.com/chrisgetsbetter). Here's the things I want to build:

- Personal Site/Portfolio (Blog)
- New Side Project Site (Blog)
- Vue URL Shortener (App)
- Wedding Site for me and [Kapehe's](https://twitter.com/kapehe_ok) upcoming marriage! (Site)

Join me in building some fun stuff to close out the year! You can always chat with me on [Twitter](https://twitter.com/chriscreates100) and find me streaming on [Twitch](https://twitch.tv/chrisgetsbetter)

## Deploying to DigitalOcean App Platform

All of these apps will be deployed to [DigitalOcean's App Platform](https://do.co/chris). The cool thing about App Platform is that we can deploy a backend (API or CMS), a database, and a frontend (React/Vue) all in one place.

## Deeper Dive into the Apps

Let's take a deeper dive into how I'll be building each of these.

### Building Blogs/Sites

To build the personal site, side project site, and wedding site, I'll need a frontend tool that I'm comfortable with. I'll be using [React](https://reactjs.org/) and more specifically [Next.js](https://nextjs.org/). 

I've done some research building out App Platform projects with Strapi and Next.js and also with [Laravel and React](https://youtu.be/1T3d7P_V2t4)

### Vue URL Shortener

I'll be using a Django API and Vue for the frontend. I'm using Vue here to switch things up and try something that isn't React. A hackathon is a great place to try out new technologies!

## Let's Build

Lots of fun to happen in December and I'm excited I finally get to finish out some projects I've wanted to do for a while now. Join me by [checking out the hackathon](https://dev.to/devteam/announcing-the-digitalocean-app-platform-hackathon-on-dev-2i1k).
Advent of Code 2020 Solution Megathread - Day 14: Docking Data
Tags: adventofcode, challenge
Published: 2020-12-14 18:07:14

---
title: Advent of Code 2020 Solution Megathread - Day 14: Docking Data
published: true
description: Boat bits!  We're twiddling boat bits!
tags: adventofcode, challenge
series: Advent of Code 2020
cover_image: https://dev-to-uploads.s3.amazonaws.com/i/6nc7y9eg3tv47voqojqe.png
---

OK, yesterday's part 2 was one of the first times I would personally say I hit a wall where I had to get algorithmically sneaky to get something fast enough.  I don't know if that's because I'm using C, so even if my code is garbage, it's fast enough for most things, or because we're in the second half of AoC and $@!# just got real.  We'll have to see.

## The Puzzle

In [today’s puzzle](https://adventofcode.com/2020/day/14), we are un-done with boats.  I thought we were off the boat yesterday, but we're back on the boat today and fiddling with bits to fix the ships docking computer.  Also, the memory locations are 36 bits wide because, "Ho ho ho."

## The Leaderboards

As always, this is the spot where I’ll plug any leaderboard codes shared from the community.

```
Ryan's Leaderboard: 224198-25048a19
```

If you want to generate your own leaderboard and signal boost it a little bit, send it to me either in a DEV message or in a comment on one of these posts and I'll add it to the list above.

## Yesterday’s Languages

Updated 10:06AM 12/14/2020 PST.

| Language   | Count |
|------------|-------|
| Rust       |     3 |
| Ruby       |     1 |
| C          |     1 |
| JavaScript |     1 |
| Haskell    |     1 |
| COBOL      |     1 |
| Python     |     1 |

Merry Coding!
How do you describe your job to family?
Tags: discuss, watercooler, rudderstack
Published: 2020-12-14 18:03:10

I've always had a difficult time explaining my jobs to my family. None of them work in tech or have ever developed, and almost none of them went to a university. So the context about what my job consists of (or that there are even jobs like mine) just doesn't exist for most of my family.

When I was fresh out of undergrad, it was easier. I could just tell them that I built software, but, if they probed deeper, like what software I build or what part of it I work on, the train came off the rails. It's gotten even more difficult as I've progressed in my career.

How do you describe your job to your family or your parents or, even better, your grandparents?

<br />  
*Cover photo by [Nielson Caetano-Salmeron](https://unsplash.com/@nielsoncaetanosalmeron?utm_source=unsplash&amp;utm_medium=referral&amp;utm_content=creditCopyText) on [Unsplash](https://unsplash.com/s/photos/family-food?utm_source=unsplash&amp;utm_medium=referral&amp;utm_content=creditCopyText).*
SubReddits Every Developer should follow
Tags: programming, productivity, beginners, showdev
Published: 2020-12-14 18:00:15

I have always been a great fan of Reddit but, I also feel that it is kind of underrated and underutilized when it comes to developers and students. Till now, I have had a great experience over Reddit with seeking feedback, showcasing work, getting solutions, and hence, I felt why not share with everyone how great Reddit is. I have made a curated list of channels that I feel every developer must follow. Feel free to go over it and join the ones you like and I promise you won't regret it.
Also, don't forget to star the repo, as I will be updating it from time to time. 

[MustFollowRedditChannels](https://github.com/MadhuNimmo/MustFollowRedditChannels)
![MustFollowRedditChannels](https://dev-to-uploads.s3.amazonaws.com/i/pipfsp6ihyxyy9a49vdh.png)

Also, I am looking for contributors to translate this resource in other languages so that it is accessible to all.Feel free to reach out to me if you want to contribute.

<img width="80%" style="width:80%" src="https://media.giphy.com/media/hXJgYmxVtfPgp1JSMb/giphy.gif">
Celebrating Hanukkah at Anvil
Tags: python, chanukka, hanukkah, webdev
Published: 2020-12-14 17:32:01

# A Python Web App For Every Night of Hanukkah

We've been lighting our menorah and getting excited for donuts and latkes! People around the world are celebrating Hanukkah with food, gifts and fun.

Not to be outdone by those parents who give a new gift _every single night_ of Hanukkah, Anvil has prepared some special treats for you! Each night you can look forward to a **new web app, built with nothing but Python!**

#### How Many Candles?

One app I enjoyed making is a handy guide to getting lit:

![How many candles?](https://dev-to-uploads.s3.amazonaws.com/i/l53zui4njbgl9f862re8.png)

[How Many Candles](https://anvil.works/hanukkah/how-many-candles)

Daily emoji to remind you when to light the candles!

#### Check out the rest of our Hanukkah event:

[Open the Hanukkah Countdown](https://anvil.works/hanukkah)
The Categorical Machine and Interactive Programming
Tags: categorytheory, functional, curryhoward
Published: 2020-12-14 17:29:16

Why bother with Category Theory or Categorical Machines?

We believe that Categorical Machines go beyond Functional Programming by treating code more like a database. This allows developers to leverage well-known Curry Howard (e.g. "Computational Trinity") correspondences to perform ad-hoc operations on the codebase, much like how ad-hoc queries in a database work. This sort of intuitive interactivity feels more natural and allows developers to reason about code without having to resort to advanced mathematical logic. Additionally, Categorical Machines are a convergent technology that can exploit next generation memory hardware. But we might be biased.

https://vimeo.com/487817268
What jobs should new developers apply for?
Tags: career, webdev, devops, culture
Published: 2020-12-14 17:28:22

Eric Silverman, CEO and cofounder of FeaturePeek, discusses how many new developers aren't aware of job roles that would be a great fit for them, things developers should know when starting their first software engineering job, and lesser-known roles that new developers should consider to improve prospects on the job hunt.

Eric's GitHub: https://github.com/eric-silverman

Learn more about FeaturePeek: https://featurepeek.com/
Learn more about the Mintbean developer community: https://mintbean.io/
Checkbox array back-end in PHP.
Tags: php, html
Published: 2020-12-14 17:26:05

That's my first contact with PHP and I'm very content with my evolution from the understanding til the execution of my ideas. 
![Alt Text](https://dev-to-uploads.s3.amazonaws.com/i/0t338ubpqudeb5wrlbid.png)
![Alt Text](https://dev-to-uploads.s3.amazonaws.com/i/f71w9rfhy0byx1s6i5ov.png)

This is part of a course of PHP by freeCodeCamp. I highly recommend if you know nothing about PHP. Follow the link below:
https://www.youtube.com/watch?v=OK_JCtrrv-c&t=9026s
How to setup VSCode (DevContainer) + Shopify Apps ( NodeJs)
Tags: shopify, ecommerce, vscode, docker
Published: 2020-12-14 17:23:46

---
title: How to setup VSCode (DevContainer) + Shopify Apps ( NodeJs)
published: true
description: Learn how to start to use a new Docker environment via DevContainer in order to have a better environment to work with your Shopify apps in NodeJS using VSCode. With the files provided, you can specify the NodeJS and Shopify CLI version.
tags: shopify, ecommerce, vscode, docker
canonical_url: https://rafaelcg.com/posts/setup-devcontainer-vscode-shopify-node-app
---

If you work with VSCode and have your local environment directly in your machine I recommend starting to looking Docker, it's an easy way to have your app running in a virtualized environment with its own OS and packages to each app.

## Advantages
\- Work in an environment exactly as production.
\- Don't install all the packages to all projects directly on your machine.
\- Be more productive, avoiding issues and mistakes with node version or Shopify CLI version.

## How to start
You just need to create these two files in your project's root folder.

**.devcontainer/devcontainer.json**

```
{
  "name": "Node.js",
  "build": {
    "dockerfile": "Dockerfile",
    // Update 'VARIANT' to pick a Node version: 10, 12, 14
    "args": {"VARIANT": "14", "SHOPIFYCLI": "1.5.0"}
  },

  // Set *default* container specific settings.json values on container create.
  "settings": {
    "terminal.integrated.shell.linux": "/bin/bash"
  },

  // Add the IDs of extensions you want installed when the container is created.
  "extensions": ["dbaeumer.vscode-eslint"],

  // Use 'forwardPorts' to make a list of ports inside the container available locally.
  "forwardPorts": [80, 3456, 4040],

  // Use 'postCreateCommand' to run commands after the container is created.
  "postCreateCommand": "npm install",

  // Comment out connect as root instead. More info: https://aka.ms/vscode-remote/containers/non-root.
  "remoteUser": "node"
}
```

**.devcontainer/Dockerfile**

```
ARG VARIANT="14-buster"

FROM mcr.microsoft.com/vscode/devcontainers/javascript-node:0-${VARIANT}

RUN apt-get update && export DEBIAN_FRONTEND=noninteractive \
    && apt-get -y install --no-install-recommends ruby

ARG SHOPIFYCLI="1.5.0"

RUN wget https://github.com/Shopify/shopify-app-cli/releases/download/v${SHOPIFYCLI}/shopify-cli-${SHOPIFYCLI}.deb \
    && sudo apt install ./shopify-cli-${SHOPIFYCLI}.deb && rm ./shopify-cli-${SHOPIFYCLI}.deb
```

To finish it, install the [Remote Containers extension](https://marketplace.visualstudio.com/items?itemName=ms-vscode-remote.remote-containers).

![Remote Container - Visual Studio Code](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/b7qujjhbsj8yp18eotuk.png) 

Then you just need to open your VSCode and type `CMD + Shift + P` and execute the command below.

    > Remote-Containers: Open Folder in Container