teleren/devto huggingface dataset:
Querying Firebase Realtime Database and Cloud Firestore from your terminal
Tags: npm, node, firebase, database
Published: 2020-10-30 03:33:29

I believe that the way we all learn writing queries for a database is quite similar. After learning the basics, we pull up our terminal, start the database server and practice writing different queries. Apart from learning, a database shell also acts as a very good testing tool. Most of the databases provides us with an interface so that we can learn, except **Firebase databases**.

![Firebase](https://dev-to-uploads.s3.amazonaws.com/i/gchk8fhts5e717g3nzhs.png)

When I first used realtime database, the fact that I couldn't double check the output of my query really bugged me. So I decided to create a solution for this - **[Fireshell](npmjs.com/package/fireshell)**.

# Getting started with fireshell

[Fireshell](npmjs.com/package/fireshell) is a CLI tool which can be used to execute realtime database and cloud firestore queries in your terminal.

### Installing the package

To install fireshell, just run the following command:-

```
npm install -g fireshell
```

Make sure you have node.js and npm installed on your system before running this command.

### Connecting the shell with the database

To start the shell, simply run `fireshell` in your terminal. You will be prompted a few questions.

The shell will first ask you to select a database:-

```
? Choose one of the following (Use arrow keys)
> Realtime Database
  Cloud Firestore
```
Then you have to provide the **absolute path** to your firebase config file. It has to be a JSON file that you recieve from firebase to connect your application with your firebase project.

```
? Enter the absolute path to firebase config file
> /root/path/to/your/config.json
```

Finally, you have to provide the URL of firebase realtime database. If you are connecting to realtime database, you need to provide this url. But if you are trying to connect to firestore, you can ignore it.

```
? Enter the URL of firebase realtime database. (Ignore if you chose cloud firestore)
> https://<YOUR FIREBASE PROJECT NAME>.firebaseio.com/
```

Once these inputs are provided, the shell will be connected to your database.

### Writing Queries

Your queries must start with the keyword `db`. This `db` is a variable that stores reference to the database object. You can chain the rest of your query as you normally do.

For realtime database, make sure that you end any read query or any query that returns some data with the once method and pass value as its argument.

Some basic examples on writing queries are provided [here](https://github.com/AayushK47/fireshell/blob/master/README.md#writing-queries).

# Final Words

Thank you for checking out this blog article. Do try out fireshell and share your experience. If you face any issue or if you want to make some contribution to this project, head on to the [github repo](https://github.com/AayushK47/fireshell) and create an issue. 

Happy learning
Ciao!
Becoming a coder #005 - Mentoring my non-coder friend in his programming journey
Tags: beginners, motivation, mentoring, portfolio
Published: 2020-10-30 03:29:40

Sam has been learning coding since December 2019, we talk every two weeks about his progress. We record our calls thinking that maybe some other beginners would find some of what we discuss useful.

https://www.youtube.com/watch?v=6GKNXRpF_QM
{% youtube 6GKNXRpF_QM%}

This call was recorded on beginning of July 2020, where we discussed Gulp build system, web app project structure, build systems in general, and understanding what files do what in your application. We also dig into reviewing Sam's portfolio site, speaking of various UI and UX aspects of it, trying to optimise it for potential 'customers' that would review Sam's skills in the future.

Hope some of you may find it useful 👋
Using custom HTML Attributes
Tags: javascript, html, tutorial, webdev
Published: 2020-10-30 03:28:18

Just want to see the result? Head to [https://winstonpuckett.com/blog](https://winstonpuckett.com/blog) and click on the search button.

I wanted a meaningful reason for people to visit my "blog" page. It was just a copy of my home page without the excerpt about how I liked good code. I realized a search bar would add a lot to the user experience.

I had only one problem. My entire blog was pre-rendered with 11ty. I wanted a way to grab the tag list without stuffing everything into a JS rendered component. That's when I found custom attributes.

# Setting and Getting

Any attribute that starts with "data-" gets saved into the dataset variable for a component. For example:

```html
<p id="element" data-my-variable="value">example</p>
```

Can be queried like so:

```js
const $el = document.querySelector('#element');
const myValue = $el.dataset.myVariable;
```

As you can see, the JavaScript can access any attribute with the "data-" prefix from the dataset variable on the node. It automatically translates variable names from kebab-case to camelCase to align with JS standards.

# Storing complex types

My next challenge was the limitation on what types you can store in the variable. I had an array of tags that I wanted to store, not a string. Because I am using Liquid templates with 11ty, I was able to insert the array like so:

```liquid
<div class="card" data-post-tags='{{ post.tag_list }}'></div>
```

Notice the single quotes so that each double quote in the array is assumed to be part of the string.

Then to access it, I had to parse the array with JSON.parse().

```js
const $card = document.querySelector('.card');
const tags = JSON.parse($card.dataset.postTags);
```

At that point, the tutorial is more about array methods in JS. I used document.querySelectorAll, filter, and includes to find all of the relevant and not relevant posts based on the search input. It was really easy. I was so grateful to have a way to embed custom tags into html and retrieve them through a simple JS API.

# Where to go from here

Go check out the search bar in action: [https://winstonpuckett.com/blog](https://winstonpuckett.com/blog). 

At this point, none of the JS is minimized, so it's easy to see how everything works in the script tag just above the input. I do store it in a separate JS file, but it is baked into the HTML when you run eleventy.

Want to see the full source code? [https://github.com/winstonpuckett/blog](https://github.com/winstonpuckett/blog)
Planificando el desarrollo de una App para planificar desarrollo 👨‍💻
Tags: planning, dev, project, react
Published: 2020-10-30 03:12:01

¿Cuantos de ustedes ademar de lidiar con la planificación de proyectos lidian también para encontrar con la app correcta para tal fin? 

Si bien cada organización tiene sus requerimientos y necesidades específicas encuentro que no existe en el mundillo del soft una app de planificacion de tareas y proyectos pensada especifícamente para él área de desarrollo.

Así que... como si tuviese mucho tiempo libre me dispuse a pensar una solución enfocada en la facilidad de uso + una buena UX. Les contaré cómo irá avanzando (lentamente) y compartiré pronto el repo.

![Sketch](https://dev-to-uploads.s3.amazonaws.com/i/pkyhph8vlsyts6j0nw43.jpg)

¿Que feature no debería faltar en una app de planificación para devs?

Si lo que vamos a planificar son apps el minimo de datos que necesitariamos mostrar es :
- Name : String
- Type : [App, Desktop, API, Script, Interface]
- Description : String
- Start date
- End date

Y a fines de estilizar la información agregaria
- Color
- Icon
- Priority

![Mockup](https://dev-to-uploads.s3.amazonaws.com/i/l0gy3hjhoeeasn5p6c9d.png)

En base a esta información iré armando el desarrollo el cual será hecho utilizando ReactJS.

#dev #planning #devplan #project #developments #developer #ideas
Why You Should Be Using React
Tags: react, javascript, webdev, reactnative
Published: 2020-10-30 03:06:02

One of the most important decisions in web development is to choose the right tool for the right job. I have been using the ReactJS library for a while and I will give you some reasons to pull it out of the toolbox for your next job. 


##You Don't Have Much Time 
![ReactJS](https://dev-to-uploads.s3.amazonaws.com/i/kuita4ln5ca04fjfmeay.jpg)
ReactJS lets you build lightning-fast apps by allowing you to build reusable components that you can place all over your project. The library is architected to be really simple to pick up and start repurposing your user interface view logic in very little time. 


##You Are Looking For A Performance Boost

ReactJS will allow for a great boost in your apps. The Virtual DOM and Diffing algorithm help for the most efficient rendering off components during a process called Reconciliation. Separate trees of React elements will be compared and only changed elements will be rerendered in the proper components. 


##You Want To Go Cross-Platform 
![Mobile App](https://dev-to-uploads.s3.amazonaws.com/i/ygw2kjblskbzm6dsbh3w.jpg)
The ReactJS library allows you to develop mobile apps on both IOS and Android. You can repurpose up to approximately 85% of your React knowledge to learn the React Native library to build a cross-platform application. In many cases, you may also be able to use much of your ReactJS codebase for your React Native mobile app. 


##You Want to Join A Great Community & Vast Ecosystem

The ReactJS community is great and is filled with inspiring developers willing to help you take your React understanding to new levels. The ecosystem has many cool component libraries to include in your projects to speed up development in style. 

##You Need A Well - Maintained Tool 

The ReactJS library is maintained by Facebook and offers really useful documentation and resources to learn React. The team also releases pretty regular improvements to the library along with helpful blogs to take advantage of any new features.


So now you have more than a few great reasons to use ReactJS in your next project. If you enjoyed this post feel free to leave a comment about your next ReactJS project. 



Happy Coding, 
Terry Threatt
Startups: Should it feel like working for free?
Tags: discuss, startup, career, experience
Published: 2020-10-30 02:44:24

---
title: Startups: Should it feel like working for free?
published: true
description: 
tags: discuss, startup, career, experience
//cover_image: https://direct_url_to_image.jpg
---
Recently I have been asked to join an exciting startup as one of the core developers. I was thinking it is a good opportunity to stop working for other people and start my own. It is just a weekend project until we make an MVP so that they could present it and find investors.

They say we can't pay you for your work now because we don't have money but record your time and that will be your investment into the company. Later on, when we get to register our business, your share of business will be calculated based on the hours you spend.

A couple weeks are passed and I realized 10 other people are joined the project from developers to marketing advisors.

Despite what I hoped for, there has been no group meeting to talk about the progress, business plans, market research, strategies, etc. Maybe I am wrong, but I think at this early point everyone should be involved in planning. 

I am a developer, but when I join as a core member it means I am a founder. The idea is not mine but the implementation will be mine. I expect to contribute to making decisions so to feel like this project is my own, but rather, I am receiving memo like updates about what has been done, who has joined, even a handout of my deliverables!

At this point I feel like I am being considered to work as a developer for new employers and for free!

Based on your experience, do you think this is normal? I suspect they just want someone to develop their ideas not a co-founder. What do you think?

Thanks
BACKEND, DATABASE, STORAGE..... which do you prefer to use for React, Vue or Django. when and why? 
Tags: django, react, vue, database
Published: 2020-10-30 01:57:36

When your working on a project. What database do you use and when? 
I’ve been using Django + Python for a while and it’s more strait forward then creating CRUD or a Admin to add products easier. 

But, what do you do for a Frontend when you need a DB? Is SQLite3 good?
Hacktoberfest! My second PR!
Tags: opensource
Published: 2020-10-30 01:51:01

As exciting as it is, Hacktoberfest has been held a huge interest in me even though this is the first time I have been a part of it. It takes me a decent amount of time to find what to do next for my 2nd PR since there are so many options on the markets. And we all know that the more options we have, the indecisive we might be. 

Therefore, picking a project to work on is always the first difficulties I have to encounter whenever I want to contribute for open source. Fortunately, I have found a repo that held my interest. It was [Survol](https://github.com/mdolr/survol), a browser extension that allows user to preview a link before clicking.

And can you guess what I can contribute in the project? Well, the maintainer need to be more user friendly so that they need [help translate their work into another language](https://github.com/mdolr/survol/issues/116). Okay it is not coding but I'll take my chance any way.

I used to find it difficult to comprehend English. So, I know how challenging it could be for those whose first language is not English to interact with a program. And I am proud that I could make a minor change that help improve it. I [make a minor contribution](https://github.com/mdolr/survol/pull/148) that add support for Vietnamese language.

Even though the change is not significant, I am happy that I'm starting to get more involved with open source. I do hope I can really make something bigger in the future even after Hacktoberfest.
Hackerberfest
Tags: hacktoberfest
Published: 2020-10-30 00:56:47

<!-- ✨This template is only meant to get your ideas going, so please feel free to write your own title, structure, and words! ✨ -->


### [Intro Heading]
<!-- If you are new to the DEV community, introduce yourself and share a bit about why you joined DEV and decided to participate in Hacktoberfest this year.  --> 
### Background

<!-- Are you brand new to open source? What about coding in general? Tell us about how you got here →

### Progress

<!-- Share a bit about where you’re at in your Hacktoberfest journey. What stage are you at? How has the process been?  -->

### Contributions

<!-- This is where you can list the contributions you made and explain why you chose the projects you did. Don’t forget to add links!  -->


### Reflections
<!-- Overall, how has your Hacktoberfest 2020 experience been? If you’re a first-timer, will you participate again? What have you learned? Have you made any interesting connections? What is your next step in open source?  -->
What do you think about PHP code quality metrics?
Tags: php, codequality
Published: 2020-10-30 00:34:07

At the moment, a lot of PHP code has been written and many of the projects contain a lot of legacy architecture that can be improved. One way to find architecture issues is to use code quality metrics such as Lack of Cohesion in Methods 4 or Instability.

Right now, I'm developing the [analyzer] (https://github.com/i582/phpstats) for calculating various metrics in PHP code that could process huge codebases in a little time. At the moment, this is about 80k lines of code per second on the Core i7.

Currently only supported:
1. Afferent couplings:
2. Efferent couplings:
3. Instability:
4. Lack of Cohesion in Methods;
5. Lack of Cohesion in Methods 4.

However, I am very interested to know what metrics do you consider important and necessary for this kind of analyzer?

Thank you for your time. 🤗
Measuring progress as a developer
Tags: codenewbie, career, discuss, learning
Published: 2020-10-30 00:20:26

Progress comes slowly, but still, if I think of where I was a year ago I am certain that I have come a long way. There are few days where I can close my laptop for the day without having learned something useful. Though I know I have picked up a lot of new skills, it is tough to quantify progress on one's journey to become a better developer.

So here is my question for the DEV community, how do you measure progress in your career as a developer? 

My initial stab at answering this question is looking at the projects I lead at work. Early on, I mostly contributed small pieces to larger projects. In the past year the number and scope of things that I oversee has grown quite a bit. 

Another approach is looking at skills. I have learned quite a bit about leveraging Redis and Mysql in the past year. Should I measure progress by looking at growing list of skills I could put on my resume?

Even in combination, these still don't seem to fully capture the idea of career progress to me. What do you think? How do you measure career growth?
Oreo Kıyamete Hazır
Tags: oreo
Published: 2020-10-30 00:17:33

![Alt Text](https://dev-to-uploads.s3.amazonaws.com/i/9rrpxiehpc7rz1gdcwjh.jpeg)

Oreo bisküvileri kıyamete hazır. Şirket, Norveç'te bir sığınak inşa etti.

Detaylar için: https://kayiprihtim.com/haberler/bilim/oreo-asteroit-gecirmez-siginak-kiyamet/
Querying 404's using Kusto and Log Analytics in Azure Application Insights
Tags: azure, apm, logging
Published: 2020-11-23 16:13:25

---
title: Querying 404's using Kusto and Log Analytics in Azure Application Insights
published: true
date: 2020-10-30 00:00:00 UTC
tags: azure, apm, logging
canonical_url: https://swimburger.net/blog/azure/querying-404s-using-kusto-and-log-analytics-in-azure-application-insights
---

When you integrate Azure Application Insights into your web applications, a lot of telemetry is captured and made available for querying and visualizing. HTTP requests are one of those datapoints stored in the underlying Log Analytics workspace. 

Over time websites evolve and so do their URL's. One challenge in maintaining websites is finding broken URL's that no longer exist and providing redirects to the new location of the content. Using Application Insights and its built-in Log Analytics workspace, you can easily query HTTP requests that resulted in a 404 HTTP Status response code.

## Querying 404's

Navigate to your Application Insights resource in the Azure Portal:

 ![Screenshot of an Azure Application Insights resource](https://swimburger.net/media/qn0ozjth/application-insights-resource.png)

Navigate to the 'Logs' section:

 ![Screenshot of Azure Application Insights Log Analytics workspace querying 404&#x27;s](https://swimburger.net/media/gdpbboih/application-insights-404-log-query.png)

Inside of the query editor, copy/paste the following Kusto query:

```
requests
| where resultCode == 404
| summarize Count=sum(itemCount) by url
| sort by Count 

```

This query does the following:

- fetch requests from the ' **requests**' table. This is the table where HTTP requests are stored.
- filter to requests that resulted in a 404 HTTP Status response.
- Group the requests by **'url'.** Sum-aggregate the request rows by the ' **itemCount**' property. 'itemCount' will be 1 or higher depending on how the requests were sampled. If similar requests were sampled, they are rolled into a single row and the 'itemCount' is increased.
- Sort descending by the aggregated ' **Count**'.

The result will be a table where every URL represents a row and you can see the amount of requests made to that URL resulting in 404. You can use this data to find your biggest 404-issues and then manually figure out how to resolve them.

404's don't have to necessarily be resolved. When a URL doesn't have any content and there's no new location where that content lives, a 404 is the correct response. Though from a business perspective, that may not be the desired user experience.

Hopefully, this helps you improve your websites!
Hide NGINX Version
Tags: nginx, server, proxy
Published: 2021-01-04 12:58:22

---
title: Hide NGINX Version
published: true
date: 2020-10-30 00:00:00 UTC
tags: nginx, server, proxy
canonical_url: https://tech.serhatteker.com/post/2020-09/hide-nginx-version/
---

By default, the Nginx version displayed when you query HTTP headers generated by the Nginx server.

For instance below config taken from [Docker Nginx 1.18 Stable] image:

```nginx
# /etc/nginx/nginx.conf
user  nginx;
worker_processes  1;

error_log  /var/log/nginx/error.log warn;
pid        /var/run/nginx.pid;


events {
    worker_connections  1024;
}


http {
    include       /etc/nginx/mime.types;
    default_type  application/octet-stream;

    log_format  main  '$remote_addr - $remote_user [$time_local] "$request" '
                      '$status $body_bytes_sent "$http_referer" '
                      '"$http_user_agent" "$http_x_forwarded_for"';

    access_log  /var/log/nginx/access.log  main;

    sendfile        on;
    #tcp_nopush     on;

    keepalive_timeout  65;

    #gzip  on;

    include /etc/nginx/conf.d/*.conf;
}
```

If we send request to the server we get a headers like below:

```bash
$ http --headers localhost:8080

HTTP/1.1 200 OK
Accept-Ranges: bytes
Connection: keep-alive
Content-Length: 612
Content-Type: text/html
Date: Fri, 30 Oct 2020 15:05:27 GMT
ETag: "5e9eea60-264"
Last-Modified: Tue, 21 Apr 2020 12:43:12 GMT
Server: nginx/1.18.0
```

I used [httpie] but you can use curl as well:

```bash
$ curl -I localhost:8080
```

## Hiding

In order to hide Nginx server header info we need to add `server_tokens off;` to the config file.

```nginx
# /etc/nginx/nginx.conf
user  nginx;
worker_processes  1;

error_log  /var/log/nginx/error.log warn;
pid        /var/run/nginx.pid;


events {
    worker_connections  1024;
}


http {
    include       /etc/nginx/mime.types;
    default_type  application/octet-stream;

    log_format  main  '$remote_addr - $remote_user [$time_local] "$request" '
                      '$status $body_bytes_sent "$http_referer" '
                      '"$http_user_agent" "$http_x_forwarded_for"';

    access_log  /var/log/nginx/access.log  main;

    sendfile        on;
    #tcp_nopush     on;

    keepalive_timeout  65;

    #gzip  on;

    # Here we add
    server_tokens off;

    include /etc/nginx/conf.d/*.conf;
}
```

Now if you send request you will see:

```bash
HTTP/1.1 200 OK
Accept-Ranges: bytes
Connection: keep-alive
Content-Length: 612
Content-Type: text/html
Date: Fri, 30 Oct 2020 15:05:27 GMT
ETag: "5e9eea60-264"
Last-Modified: Tue, 21 Apr 2020 12:43:12 GMT
Server: nginx
```

> **INFO**
> 
> We can set server_tokens in *http*, *server*, or *location* context only.


All done!




[Docker Nginx 1.18 stable]: https://github.com/nginxinc/docker-nginx/blob/5488180ebdd45b12b45107694dfa92dc878a2795/stable/buster/Dockerfile
[httpie]: https://httpie.io/
How to list Open Source work on resume?
Tags: help, opensource, codenewbie
Published: 2020-10-29 23:43:26

Hey you wonderful people! :)

So I've noticed that my profile is a bit different, in the sense that I try contributing more to issues(at my own pace) but I do not have impressive side-projects. 

They are tiny UI fixes, changes to Rails models and stuff like that, I was wondering if it was worth creating a new section on my resume and mentioning my contributions and limit the number of side-projects to one as I seem to spend more time trying to find issues/repos and work on them rather than work on personal projects.

Would be great if any of you folks could weigh in!

Thanks in advance.