teleren/devto huggingface dataset:
Angular Enterprise Security Academy is OPEN 🤩
Tags: angular, webdev, javascript
Published: 2020-07-03 13:45:29

---
title: Angular Enterprise Security Academy is OPEN 🤩
published: true
cover_image: https://dev-to-uploads.s3.amazonaws.com/i/fwk0b3ne7lht1djfboux.png
tags: angular, webdev, javascript
---

Do you want to learn all you need about **Web Security** and implement **a role-based enterprise-grade authorization** in Angular and Node.js?

I am happy to announce that *Angular Enterprise Security Academy* is open!
During the upcoming 12 weeks, we will be *working together* with our group to

* Have a solid understanding of the Web Security model
* Know Web Security vulnerabilities and prevention methods
* Implement a role-based authorization system in real-life application
* Know how to secure Angular application and backend API

You can join here [https://angular-academy.com/security](https://angular-academy.com/security/?utm_source=dev_to2) and use exclusive  **DEV_TO_100** discount code to get 100$ off the price!

The idea is that students learn from the videos in their own time, and we meet on a weekly basis on live sessions to answer questions, review the code and overcome all challenges!

Let's meet there!
How to call a function on path change in Javascript
Tags: javascript, utility
Published: 2020-07-03 13:36:50

Modern JS frameworks tend not to reload the page but manipulate DOM and change URL path for internal navigation, for performance and smooth UX. But since there is no page reload, `window.onload` event does not get triggered for subsequent navigation. We run into a situation where we need to call a function whenever URL path changes (not the hash).

### Problem
The [`itsopensource.com`](https://itsopensource.com/) blog is built using [gatsby](https://www.gatsbyjs.org/), we wanted to add google analytics to this, but instead of using google tag manager, we tried to restrict what [data](https://github.com/tsl143/itsopensource/blob/master/src/html.js#L32) is sent to google and in this process, we need to send XHR request on every page load. We created a function `sendTelemetry` and called it on `window.onload`. This works as expected (partially), whenever the page is loaded the XHR is sent, but gatsby do not reload the page while changing the URL when any blog link is clicked, so XHR is sent only once per session and not on subsequent page loads.
Javascript does not provide any native listener to path change (not hashchange).

### Solution
The `history` API maintains complete the navigation state. Whenever a new page is navigated `history.pushState` is called and page is added to the state. That means this event is called whenever the URL changes. We hooked our function on this, and done :)
```Javascript
(function(history){
    var pushState = history.pushState;
    history.pushState = function(state) {
      // YOUR CUSTOM HOOK / FUNCTION
      console.log('I am called from pushStateHook');
      return pushState.apply(history, arguments);
    };
})(window.history);
```

### Demo
A quick demo can be the following:
1. Open the browser console on this very page.
2. Paste the above-written code snippet.
3. Keep console open and navigate various pages on this blog
4. You should see a message in console on every navigation.


*The first choice for the title was `how to hook a function on history.pushState`.*  

Reference: [stackoverflow](https://stackoverflow.com/questions/4570093/how-to-get-notified-about-changes-of-the-history-via-history-pushstate) 😉
Tapes from v i v i d
Tags: codepen
Published: 2020-07-03 13:22:44

<p>A VueJS based Audio Player created using HTML5 Audio API.</p>

<h2>Credits</h2>

<ul>
<li>Vue</li>
<li>Animate.css</li>
<li>Daniel Simon (@soundbible.com)</li>
<li>Unsplash</li>
</ul>

<h2>TODO</h2>

<ul>
<li>LocalStorage to add music</li>
<li>Preload Images</li>
<li>~~smooth image trasition~~</li>
<li>~~better minimal icons~~ not viable</li>
<li>documentation</li>
</ul>

<h2>Featured</h2>

<ul>
<li><a href="https://vuejsexamples.com/a-vuejs-based-audio-player-created-using-html5-audio-api/" target="_blank">https://vuejsexamples.com/a-vuejs-based-audio-player-created-using-html5-audio-api/</a></li>
<li><a href="http://p.bdir.in/p/VueJS-Audio-Player-V2/9637" target="_blank">http://p.bdir.in/p/VueJS-Audio-Player-V2/9637</a></li>
</ul>

<p>:)</p>

{% codepen https://codepen.io/matt-porta/pen/OJMzBXq %}
Buildereum
Published: 2020-07-03 13:10:53

As you know:
Delphi is a development environment that compiles into native apps for Windows, macOS, iOS, and Android.
Ethereum is a blockchain-based distributed computing platform and operating system featuring Smart Contracts.
So
Delphereum is a Delphi interface to the Ethereum blockchain that allows for development of native dApps (aka decentralized applications).
Now my colleagues get my meaning from Buildereum :-)
Buildereum which I am working on; is C/C++ Builder interface of Delphereum for people like me who are interested in working only in C/C++.
Trailblazer is back, better then ever!
Tags: ruby, rails
Published: 2020-07-03 13:09:49

---
title: Trailblazer is back, better then ever!
published: true
description: 
tags: ruby, rails, 
cover_image: https://dev-to-uploads.s3.amazonaws.com/i/hwfqjpwypaf3y2wpelqj.png
---


For those who know Trailblazer - you know that for the last 6 years TRB evolved a few times, introduced a lot of great ideas but also had it's problems: missing documentation, lack of communication with the community, and inconsistent approach to some problems. We strongly believe the current version, along with the support of the core team and the new landing page (with complete documentation) is worth working with.

For those who somehow haven't hear about Trailblazer - check it out. Probably for some complex projects where Rails aren't sufficient that tool could be really helpful and efficent.

The main changes coming with the new version of TRB relate to:
- Major API change,
- Autoloading,
- New website with complete documentation,
- Tracing.


##API CHANGES

The updated version 2.1 contains some necessary and sound improvements in the method signatures. One of these changes is the replacement of the automatic merging of `params` part and additional options with the possibility to pass one hash to the `call` and do the merging. Second major change in API is that `ctx` elements are now accessible both as strings and symbols like in a hash. It’s worth noticing that `ctx` object is now documented in its own section. 
```
# old style
result = Memo::Create.(params, "current_user" => current_user)
```
```
# new style
result = Memo::Operation::Create.(params: params, current_user: current_user)
```

##AUTOLOADING##

The significant change to autoloading is return to Rails file and class naming structure for **operations**. This change allowed removing the `trailblazer-loader` gem, which was responsible for causing some issues and inconsistencies. 

##NEW WEBSITE##

The goal behind creating a new website was to make it as simple as possible. A lot of pages accessible through the top navigation, and then the documentation behind the DOCS link.

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

The documentation has been structured in such a way as to ensure the fastest possible access to consistent information. There's even added a new search function - something that TRB user base has repeatedly asked for. Just press the / (or Shift+7) button in the docs.

##TRACING##

The 2.1 version comes with the ability to track the operations - something that was missing in all the prior releases. This change makes debugging deeply nested operations way more pleasant. 

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

Either you know TRB already or you never heard about it, check out the [blog post about the history and changes of trailblazer 2.1] (https://trailblazer.to/2.1/blog.html) and give the core team some feedback!
3 things i’ve learned on my first full-time job as a fullstack dev
Tags: career, learning, webdev, productivity
Published: 2020-07-03 13:09:18

I have always been a freelancer. I have years of experience as a freelance web developer. But in February this year i landed my first full-time fullstack job. The thing is that being a freelancer is hard sometimes.

So i thought “why not” and was lucky enough to find, and eventually get, a job offer that i liked. Here are three things i’ve learnt from the experience:

## `1- Don't underestimate your knowledge.`

I had doubts while sending my resumes. I couldn’t take off my head the idea that i didn’t know enough for a job in a company.

The reality is that the basics are 80% of the daily job. HTML, CSS and the ability to write some decent JavaScript will get you far.

## `2- You’ll never stop learning`

The first weeks as a dev will be funny. You'll learn a lot, and by a lot i mean lots of different new technologies and platforms. How to make tasks in Jira, Teamwork or wherever. How to manage the ecommerce platform your company uses.
 
Everything you need to know, you'll learn on the beginning. After that, the learning curve will flatten and will be more steady, until you realize you are in fact creating the knowledge for the new coming devs.

## `3- More is better`

Knowing a lot of different languages or technologies can be seen as a bad thing. _Jack of all trades, master of none_ they say. Well, i now know this is a lie. You can be a jack of all trades and master of some and even master of many.

You don't need to master every single technology out there. But knowing the basics of a lot of them is very helpful. For example, I have basic knowledge of AWS, and a great knowledge of Linux systems. My company is mainly focused on frontend development. Knowing this stuff has been extremely helpful to my company and ultimately to me as a developer.

## `4- Coffee, please`

This is an extra. But i have to say it. Coffee works. Keep a constant source of quality coffee around your office (maybe home office right now) It is proven to increase your dev abilities to the 100 power.
Secure Devops Tactics 
Tags: secure, devops, development
Published: 2020-07-03 13:08:52

---
title: Secure Devops Tactics 
published: true
description: How to "try" to secure applications in the time of Devops
tags: #Secure #DevOps #Development 
cover_image: https://miro.medium.com/max/1400/1*t58VWXCzYFKV2kug7CJnuw.jpeg
---

So security, if we could agree, it's a catch up game.

I have more than 15 years of security experience and every single time I felt that I was running behind, behind developers, business goals, release times, policy, and many many more reasons.

Trying to reason a deadline or QA, Threat modeling constantly and getting into the CD/CI in the development environment is always a struggle. 

Either you have an backlog of the size of Iguazu falls, and can barely catch up, and let's face it, developers are extremely clever to back channel to get faster their feature request from an extremely ever hungrier business development.

And security can wait right? After all nothing can really happen in a few days, or hours and we can always add more firewall and so on.


But that's not the case ever, as we struggle to automate tests, incorporate more checklist and be in every meeting, every decision. One things is obvious, we are an intrinsic part of development and we should become the extra step friend that make it easier and tell everybody to wear a coat because is cold, or take an umbrella because might rain... without being the paranoid or a pain.


For that reason I started a small repo on [GitHub](https://github.com/epyphite/SecureDevopsTalks) , and a meet up weekly, to tell stories, and share advises, small recipes, little pieces of code, that can go a long way  in the SecDevOps, helping fellow Security Engineers and Architects to evangelize caution.


Security should be about protecting, oversight, recommendations and thoughtful watch, we are here to help. Not to be an inconvenience or a barrier to business.

![Responsibility](https://img.deusm.com/darkreading/MarilynCohodas/JuneCartoonJK-DRsecurotyresponsibilityCOL300.jpg)
Cookie Clicker | Delegates and Event
Tags: delegates, event, tutorial, unity3d
Published: 2020-07-03 13:00:31

Hey
In this tutorial I'll explain how to use Delegates and Events in C#, and make Cookie Clicker game :)

{% youtube BYhdJE9jYTA %}

> Like this post? 
> Support me via [Patreon](https://www.patreon.com/eranelbaz)
> Subscribe to my [YouTube Channel](https://www.youtube.com/channel/UCVUNeBGM5wZJKcOx0QwAaTA?sub_confirmation=1)
Why don't database systems have built-in mechanisms for avoiding locks while migrating?
Tags: discuss
Published: 2020-07-03 12:57:11

As your app or website becomes popular, it becomes tricky to do database migrations that alter columns without downtime. You basically have to create a new table or column, copy all the data over, and then drop the old version.

Is there any reason why database management systems couldn't do this themselves in many cases? When changing a column's type, why doesn't the database create a new column behind the scenes, write all new values there, while copying old values over in a background process?
Features Of PowerShell
Published: 2020-07-03 12:48:59



1. PowerShell is open-source – PowerShell code base is published on GitHub and open to community contributions “https://github.com/PowerShell/PowerShell”

2. Cmdlets − Compiled commands in PowerShell are called cmdlets. Cmdlets perform common system administration tasks, for example managing the registry, services, processes, event logs, and using Windows Management Instrumentation (WMI). 

3. Object-Based Approach − PowerShell is an object-oriented scripting language. PowerShell possesses powerful object manipulation capabilities. Objects can be sent to other tools or databases directly.

4. PowerShell design goals - PowerShell is designed to improve the command-line and scripting environment by eliminating long-standing challenges and adding new and modern features like discoverability, consistency, etc. 

5. Task-oriented − PowerShell is a cross-platform task automation and configuration management framework and provides supports for existing scripts and command-line tools.

6. Getting into the Pipeline - PowerShell pipes objects, not text, between commands. Each object passed along a pipeline has the methods and properties common to that type of object. PowerShell’s pipeline implementation is much richer and more modern.

7. Simple to Use − Simplified, command-based navigation lets users navigate the registry and other data stores similar to the file system navigation. As cmdlets and system data stores use common syntax and have common naming conventions, data sharing is easy. 

8. Discoverability - Powershell has been designed to be user friendly and allow users to easily discover new features and get help. For this purpose, the two most important cmdlets in PowerShell are Get-Help and Get-Command.

9. Extensible interface − PowerShell is customizable as independent software vendors and enterprise developers can build custom tools and utilities using PowerShell to administer their software.

10. Easy transition to scripting - PowerShell's command discoverability makes it easy to transition from typing commands interactively to creating and running scripts.
Rails: Special Use Cases Of MD5
Published: 2020-07-03 12:45:17

The MD5 is a hashing algorithm. It is a one-way cryptographic function. It accepts a message of any length as input and returns the fixed-length digest value.

There are various use-cases of MD5. I have listed few of them below.

https://blog.joshsoftware.com/2020/07/01/rails-special-use-cases-of-md5/
Rows vs columns
Published: 2020-07-03 12:42:18

We explain <a href="https://wlearnsmart.com/row-vs-column/">row vs column</a> when we the to arrange the data in a logical and concise manner. we know the main difference column vs row such as there are rows and columns for arranging the data only basic format.

that data can be easily viewed from the table and make reusable logic from this arrangement.we discuss all points of data arrangement.

Also, what is row and column in the table with example step by step basis concepts? Also, define the main difference between <a href="https://wlearnsmart.com/row-vs-column/">row vs column</a>.
How to create a maven archetype in 5 minutes
Tags: java, maven, archetype
Published: 2020-07-03 12:39:41

## Table Of Contents
* [Why](#why)
* [How to build](#howToBuild)
* [Structure](#structure)
* [Benefits](#benefits)
* [How to run?](#howtorun)
* [References](#references)

### Why <a name="why"></a>
Use a template project structure in order to speed up your project definition such as packages, dependencies and relationship between classes.

### How to build <a name="howToBuild"></a>
To build an archetype you should follow the rules

* The packing of project should be _maven-archetype_

* Create a file _archetype-metadata.xml_ under the folder src/main/resources/META-INF/maven.
This file is responsible to move the files classes, folders etc.
 
* The folder src/main/resources/archetype-resources should have all files to be generated by this archetype. 

![Project expanded](https://dev-to-uploads.s3.amazonaws.com/i/8o0yg6kjq0a9o8vf9rp5.png)

### Structure <a name="structure"></a>

Below look the structure desired 

![Project structure archetype](https://dev-to-uploads.s3.amazonaws.com/i/rml4twlts5055qb39o9f.png)

After open the project generated you can check the classes packages and so on

![Generated project](https://dev-to-uploads.s3.amazonaws.com/i/14zhv1j36syi5n0j4vii.png)

### Benefits <a name="benefits"></a>

* The benefits of using a archetype as said before is speed up your project creation but also to maintain the projects with the same structure and avoid copy and paste of files.

### How to run? <a name="how to run"></a>

* use the maven to build your archetype and for that execute the command ```mvn instal``` for instance [![asciicast](https://asciinema.org/a/344679.svg)](https://asciinema.org/a/344679)

* Once your template is created it's time to create your project with the template
```mvn archetype:generate -DgroupId=com.mynewcompany -DartifactId=new-project -DarchetypeGroupId={from your archetype project} -DarchetypeArtifactId={from your archetype project} ```

[![asciicast](https://asciinema.org/a/344688.svg)](https://asciinema.org/a/344688)

### References <a name="references"></a>
https://github.com/luizgustavocosta/maven-archetype-costa-luiz
https://maven.apache.org/guides/introduction/introduction-to-archetypes.html
https://pixabay.com/photos/blueprint-ruler-architecture-964629/
What did I learn by making my first Hackathon ? #Hack20 #FlutterHackathon
Tags: hackathon, flutter, discuss, motivation
Published: 2020-07-03 12:31:25

Hi everyone 👋

Recently I've participated on the #Hack20, the 2020 annual Flutter hackathon.
That was the first time that I was participating to a hackathon, and almost one of the first time I was making a tech event. So I though that I'll share my (very little) experience and some tips with you today ! 

# Making a team

You're going to spend the next 24/48 hours making code ! So an important thing is to participate as a team: if you're doing it alone, you'll probably lose motivation quickly and you'll not push yourself to learn new thing on the road.
As an example, my team was composed of 3 developers (including me), we didn't know each other before making our team, we were simply 3 people speaking the same language in the #searching-a-team channel on Slack. Turning out that we were all living on different continents ! And It was really cool to discover new Flutter developers with different habits of coding !

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

# Learning new things

With a team of random people, I discovered a LOT of new packages and a lot of new habits of code ! For example, I was always using the package Provider for state management in my Flutter projects, but we choose to use bLoC pattern for state management on the hackathon and we all learn a little bit on this new way for us to deal with state management !
We also share a lot of tips and answer each other with the bit of knowledge we had on Flutter, it was really team play at his best !

After submitting our project, we've got an overview of all the projects that were submitted and some ideas were really crazy, and made by a diversity of awesome great developers !
I've been really impressed by some of the projects and it gave me a lot of inspiration and motivation for future personal projects.

# Don't participate to win.

I've seen a lot of people participating for the cash prize, which was a crazy amount of 4.000$ this year for the first place, and more than 20.000$ in total. And I totally get why people get excited about, but in my opinion, it's really not a reason of why you should participate !

Participating to the hackathon is more like playing a new World of Warcraft expansions with friends, you start playing in the morning and you're going bed late, and during all this time on your computer:
- You're happy to spend time with your mates.
- You learn new things.
- You discover things that you'll not have searched by yourself.
- Share a unique experience.

It's maybe confusing to compare it to a game, but if you take pleasure to code with Flutter, then programming is a real game.

See you for #Hack21.
Build a REST API in Node.js
Tags: javascript, beginners, node, codenewbie
Published: 2020-07-05 14:28:27

---
title: Build a REST API in Node.js
description: In this final video of my Node.js Javascript series, we'll be building a server that returns the user's string in upper case and a REST API that returns the time passed to it as a JSON object.
published: true
date: 2020-07-03 12:31:00 UTC
tags: javascript,beginners,node,codenewbie
canonical_url: https://raddevon.com/articles/build-a-rest-api-in-node-js/
cover_image: https://dev-to-uploads.s3.amazonaws.com/i/18cwbbq37k5zjysz9071.jpg
---

_Most of the content of this video is standalone, but it's part of a series! You may want to go back and [start at the beginning](https://raddevon.com/articles/first-steps-with-node-js-part-1/)._

In this final video of my Node.js Javascript series, we’ll be building two different HTTP server projects: one that returns a string submitted by the user via POST request transformed into upper case, and a REST API that returns time passed in on a querystring as a JSON object.

Please either enjoy or forgive my lockdown hair, take your pick. 😉

{% youtube 0quNn4xLe_c %}

Video Notes
-----------

Some of the things you’ll learn:

* 📖 How to use the Node.js documentation  
* 😖 How to find help using search (Google or my favorite DuckDuckGo) and StackOverflow  
* 🧐 How to write readable, maintainable code  
* 🗣 How to respond to an HTTP request  
* ❓ How to parse a querystring  
* 🛠 How to debug code that doesn’t work  
* 🤝 How to use a third-party library  
* 🕰 Just what the heck is Unix time anyway?

If you missed the rest of the series, you may want to go check out the first episode and [get started with Node.js from the beginning](http://raddevon.com/articles/first-steps-with-node-js-part-1/)!

You might also enjoy [my quick 30-minute Vue.js tutorial](http://raddevon.com/articles/build-your-first-vue-js-app/).

Thanks for watching! If you have any questions, please post them here, in the video comments [on YouTube](https://youtu.be/0quNn4xLe_c), or [email me](mailtp:devon@raddevon.com).

Now that you’ve gone through my final Node beginner tutorial, it’s a great time to put your new knowledge to work. Check out [my 10 unique learning project ideas](https://raddevon.com/articles/10-great-web-development-learning-project-ideas/) to get started.