teleren/devto huggingface dataset:
A Brief Introduction to React
Tags: react, javascript, tutorial
Published: 2021-04-26 14:12:45

This is a short introduction to [React](https://reactjs.org/). React is an incredibly popular front-end framework that allows you to create encapsulated components that manage their own state. React has helped transform web development and bring it inline with modern software development practices.

You will be asked to follow along with the programs below. Just click on the links and a code playback page will load (you might want to open each one in a new tab). Then click on the comments on the left hand side of the playback screen or hit the play button to drive the development of the code. You can download the code at any point and run it on your machine. There are some controls in the top right hand side of the screen to make the text bigger or to switch to blog mode (which is good for small screens).

###React
I start by showing a basic example of React and JSX. I will build a site to serve info about Computer Science legends in the first three examples. This program shows the beginning of the app:
* [Basic React](https://markm208.github.io/webdevbook/chapter4/01/index.html)

Next, I continue to build the CS Legends app in a React project:
* [Creating a React App with create-react-app](https://markm208.github.io/webdevbook/chapter4/02/index.html)

I complete the CS Legends app by creating a back-end to serve legend data:
* [React with Express](https://markm208.github.io/webdevbook/chapter4/03/index.html)

Finally, I show the beginnings of creating a scoreboard app for a kids hockey league. At the end you will be asked to download the code and add to it:
* [Scoreboard React App](https://markm208.github.io/webdevbook/chapter4/04/index.html)

###Comments and Feedback
You can find all of these code playbacks in my free 'book', [An Introduction to Web Development from Back to Front](https://markm208.github.io/webdevbook/). I am always looking for feedback so please feel free to comment here or to send me a message. You can follow me on twitter [@markm208](https://twitter.com/markm208).
DjangoCMS FAQ
Tags: django, djangocms, faq
Published: 2021-04-26 14:11:45

My company released a cool open-source plugin named [DjangoCMS FAQ](https://gitlab.com/kapt/open-source/djangocms-faq/) that you can use in your websites a few weeks ago, let me describe it:

## Install

The project is on [pypi](https://pypi.org/project/djangocms-faq/), so just use pip!

```bash
python3 -m pip install djangocms-faq
```

## Features

### FAQ Plugins

* Create a `FaqContainer` Plugin that have a name, and can only contain `FaqQuestion` Plugins that have a name (the question) and keywords!
* Create answers as `TextPlugin`, `ImagePlugin` or `VideoPlugin` inside the `FaqQuestion` Plugins (this can be easily extended using the settings of your project)!
* Here's a small gif (better video [here in the readme](https://gitlab.com/kapt/open-source/djangocms-faq/#a-faq)):  
   ![create faq containers, questions & answers](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/ogpoyg1bjfetfgp666e2.gif)

### FAQ **Search** Plugin

* Create a `FaqSearchPlugin` that have a name, select all the `FaqContainers` that this instance will search into, and put it on any page on your site!
* Here's a small gif (better video [here in the readme](https://gitlab.com/kapt/open-source/djangocms-faq/#a-search-plugin-that-uses-an-api)):
   ![create faq search plugin & search into](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/kzryzsharfer1hxyzf82.gif)

## Settings

* If you don't need the `FaqSearch` you can set the `DJANGOCMS_FAQ_ENABLE_API` variable to `False` in your settings.
* You can add as many Plugins as you want in the `FaqQuestion` plugins using the `DJANGOCMS_FAQ_ANSWER_PLUGINS` list in your settings.
* If you don't wanna show the keywords in the questions, just put this var to `False`: `DJANGOCMS_FAQ_SHOW_KEYWORDS_QUESTION`.
* And if you don't want to show the keywords in the `FaqSearch` Plugin answers then put this to `False` in your settings : `DJANGOCMS_FAQ_SHOW_KEYWORDS_ANSWER`.
Introduction to iOS using UIKit
Published: 2021-04-25 18:36:07

Today, I decided to start open sourcing my iOS tutorial I've been using to teach iOS trainees (50+ I think) over many years. The tutorial I'm going to be releasing is just the last of many iterations.

I haven't done this before, because the course has been originally written in Spanish. This list of articles has been translated to English by myself.

Before listing the articles, I have to say that, if you're starting iOS development in 2021, you probably want to start by learning SwiftUI, and not UIKit. When I started writing these tutorials (back in 2017), there was no clue we were going to have a new framework to nearly replace UIKit. 

If you prefer to learn SwiftUI, I recommend [this course](https://www.hackingwithswift.com/100/swiftui) by Paul Hudson.

If you're still here, this is the list of tutorials:

- [Introduction to Swift - Part 1](https://dev.to/fmo91/introduction-to-swift-part-1-10pc)
- [Introduction to Swift - Part 2](https://dev.to/fmo91/introduction-to-swift-part-2-7m0)
- [Introduction to the View](https://dev.to/fmo91/introduction-to-the-view-3a8j)
- [Introduction to the Controller](https://dev.to/fmo91/introduction-to-the-controller-5422)
- [Using Xibs](https://dev.to/fmo91/using-xibs-2ime)
- [Navigation in iOS apps](https://dev.to/fmo91/navigation-in-ios-apps-4jm3)
- Understanding Delegation *(under translation)*
- Introduction to UITableView *(under translation)*
- Introduction to Networking *(under translation)*

Extra:

- Introduction to Cocoapods *(under translation)*
- [Swift generics](https://dev.to/fmo91/swift-generics-27o9)
- Introduction to Git *(under translation)*
- [Introduction to Swift error handling](https://dev.to/fmo91/introduction-to-swift-error-handling-45p8)

--

I honestly hope anyone could take advantage of these course.

Please reach me over dev.to, or to my [email](mailto:ortizfernandomartin@gmail.com).

Thank you!
An Introduction to GraphQL
Tags: graphql, tutorial, javascript, python
Published: 2021-04-26 14:05:14

This is a short introduction to [GraphQL](https://graphql.org/). GraphQL makes it easier to query the data in an API. GraphQL has the power to specify exactly the data you need from an API without having to retrieve data you don't plan on using.

You will be asked to follow along with the programs below. Just click on the links and a code playback page will load (you might want to open each one in a new tab). Then click on the comments on the left hand side of the playback screen or hit the play button to drive the development of the code. You can download the code at any point and run it on your machine. There are some controls in the top right hand side of the screen to make the text bigger or to switch to blog mode (which is good for small screens).

###GraphQL
I start by showing how a traditional API works. This example uses Express and a SQLite database to serve an API:
* [A Traditional API](https://markm208.github.io/webdevbook/chapter5/01/index.html)

Next, I show what a GraphQL query looks like independent of any programming language:
* [GraphQL Query Syntax](https://markm208.github.io/webdevbook/chapter5/02/index.html)

The next two examples show how to create an API using GraphQL. One uses a database and the other doesn't:
* [A GraphQL Server Without a Database](https://markm208.github.io/webdevbook/chapter5/03/index.html)
* [A GraphQL Server that Uses a Database](https://markm208.github.io/webdevbook/chapter5/04/index.html)

The final two programs show how to access a GraphQL server from the browser and the server:
* [Accessing a GraphQL Server Using fetch() and graphql-request](https://markm208.github.io/webdevbook/chapter5/05/index.html)
* [Using React to Access a GraphQL Server](https://markm208.github.io/webdevbook/chapter5/06/index.html)

###Comments and Feedback
You can find all of these code playbacks in my free 'book', [An Introduction to Web Development from Back to Front](https://markm208.github.io/webdevbook/). I am always looking for feedback so please feel free to comment here or to send me a message. You can follow me on twitter [@markm208](https://twitter.com/markm208).
Blockchain Consensus Algorithm and its Role in DApp Development
Tags: blockchain, dapp, software
Published: 2021-04-26 13:58:50

Launched in 2011, blockchain gained popularity among people in the past few years. Before this, hardly anyone knew about this revolutionary technology. 

Do you know what has brought blockchain from shadows into the limelight? Well, it’s the cryptocurrency boom. How ironic is it? Cryptocurrency is the use case of blockchain. But people came to know about blockchain with the rise of digital currencies, like Bitcoin, Ethereum, and many more. 

Today, we can see numerous businesses and government and non-government organizations relying on DApp development solutions to improve their security, immutability, and productivity. 

Did it ever cross your mind how blockchain achieves this without any centralized authority? If yes, then the answer is Blockchain Consensus Algorithm. 

●	What is Blockchain Consensus Algorithm?

It is a procedure that allows the Blockchain network’s peers to come to a common consensus regarding the real-time state of the distributed ledger. With a consensus mechanism, the blockchain network builds trust between various nodes and achieves reliability among users. On the other hand, the network promises a high level of security to everyone. Thus, the Blockchain Consensus mechanism plays a crucial role in DApp development. To know more about the objectives of the Blockchain Consensus mechanism, read below.

●	The goals and objectives of the Blockchain Consensus mechanism 

○	Attaining unified agreement - It is one of the primary objectives of the Blockchain Consensus mechanism, which is not possible in centralized systems. It’s because the authority has to gain trust. The Blockchain Consensus protocols ensure the data used is legitimate, accurate, and up-to-date. 
	
○	Align reward benefits - If you want to build a system that regulates on its own and requires no trust-building, make sure it meets the interests of participants. Its protocol offers an economic incentive to good actors. 

○	Fair and just - Another advantage of the consensus mechanism is that it allows everyone to participate in the network on the same ground. 

Apart from this, the Blockchain Consensus verifies and validates each transaction to prevent double-spending while making the network reliable and fault-tolerant. 

If you are looking for a reputed DApp development company, get in touch with Steem Experts. We have a team of experts offering numerous DApp solutions like Steem DApp development. 

https://steemexperts.com/decentralized-application-development/
Flutter vs Jetpack Compose for Desktop?
Tags: question, discuss, flutter, jetpackcompose
Published: 2021-04-26 13:53:25

I've recently been researching which of these technologies to use for making desktop apps for Windows, Linux, and as a bonus, possibly mobile apps for Android.

For context, I 'm primarily a web developer but very happy with using SwiftUI for iOS/iPadOS/MacOS for side projects. What I'm looking for is something to supplement this in other ecosystems.

So far I've installed both Flutter and Compose and tried some beginner tutorials. My first thoughts are:

## Flutter Pros

* Not restricted to a specific IDE.
* You can use Flutter cli.
* Getting Started guide was easy to follow. Even though it was for Android it worked well for Windows.
* Great support for Linux - with Ubuntu using it for software going forward.
* Lots of plugins, resources, and a big community.

## Flutter Cons

* IMO - Flutter seems less like SwiftUI than Compose - More verbose?
* Will desktop apps look like Android apps wrapped in a window? I see there are 'Yaru' style widgets for Ubuntu, but can't see anything for Windows.
* Desktop plugin ecosystem is more limited than Android.
* Has some edge case issues which make it a non-starter for certain projects. E.g. [#23913](https://github.com/flutter/flutter/issues/23913).

## Compose Pros

* I like the syntax - feels very similar to SwiftUI.
* Convenient previews in the IDE.
* Appears to a great, upcoming solution for Android.

## Compose Cons

* Currently has to use Android Studio Canary to make an Empty Compose for Desktop project.
* Code appears to differ more for each Ecosystem (Desktop vs Android). I tried following the beginner tutorial for Android but targeting Windows (Like I did with Flutter) and could not get this to work.
* Fewer resources - especially for Desktop development.

These lists look very unbalanced in Flutters favour, but as a newbie to both ecosystems I'm wondering if I'm missing something. Part of me is very tempted by Compose, but as someone not too familiar with Android Development I feel it would be more of an uphill battle.

I'm very keen to know what other people think about these two solutions, or if there is anything else out there that people are betting on!
Pair programming for the winner!
Tags: perl, python, javascript
Published: 2021-04-25 07:59:45

---
title: Pair programming for the winner!
published: true
description: 
tags: perl, python, javascript
//cover_image: https://direct_url_to_image.jpg
---

You probably have not seen yet, but that I've been doing [live pair programming sessions](https://code-maven.com/live) for a while now. I even make them live and public so you can also see how it is being done. (And I have a lot more scheduled already.)

I think this is an excellent way to learn something new, to introduce someone to a code-base, to have more cooperation among people.

I really hope that more programmers will pick up the idea and start experimenting with it.

You don't have to be expert in the subject. It is totally fine to search for answers while working in pairs as well.

## What is really pair programming?

See a lot more about [pair programming](https://martinfowler.com/articles/on-pair-programming.html)

## Tooling

You don't need any special tooling. Just a zoom (or similar) session.

## Recording

You don't have to record it and make it public. That's just extra perks.


## How to find a pair-programming partner?

For example comment here that you are interested (maybe with a link to your GitHub/GitLab repo or with a few words what are you interested in).
Then if you see others who post that  they are interested contact each other and discuss the details.

You can also contact a [CPAN](https://metacpan.org/) developer if you are interested in Perl, a [pypi](https://pypi.org/) developer if you are interested in Python, or an [npm](https://www.npmjs.com/) developer if you are interested in JavaScript/NodeJS.
Tell them you'd like to contribute to their library X and ask them if they would agree to pair program with you on the subject? Maybe they will.
Oh and you don't have to pick the author of the most popular package. Pick someone who is relatively unknown.

For Python check out my [PyDigger](https://pydigger.com/) project. If you'd like to contribute to that, talk to me.

[Sarah Withee](https://twitter.com/geekygirlsarah) has been [live pair programming](https://www.twitch.tv/geekygirlsarah) and working on [Code Thesaurus](https://codethesaur.us/) You might want to check her videos as well and maybe ask her if she wants to work with you.
Security as code
Published: 2021-04-26 13:39:16

Hi, all :)

Securing cloud infrastructure can sometimes impact a team's agility. The community is looking for different ways to secure cloud infrastructure with the DevOps mindset. Security as Code and shifting left security might provide such agility.

In this podcast we talk to Ahmed Badran, CTO & Co-founder of Magalix, we explore the challenges and problems within the cloud infrastructure and the rise of Security as code.


Listen to Podcast here: https://anchor.fm/sac-magalix/episodes/What-is-Security-as-Code-euurrv

#Kubernetes #SAC #Shiftleft #Securityascode #devops"
Bringing It All Home - Resu.Me
Tags: react
Published: 2021-04-26 13:38:16

Wrapping up our time at GA! It's really incredible how quickly time flies when you've been on the grind. I'll be writing another post to discuss my intensive experience, but I figured that I'd keep with tradition and do another retrospective post following the completion of my final project. 

My teammate for this project, Guillermo, and I independently stumbled upon our project idea. I had reached out to ask about his experience using Google Firebase only to find that we had a pretty similar idea for our capstone project - an app that lets users create resumes. We began discussing a roadmap to an MVP that night and quickly selected our stack and began trying to build a proof-of-concept. 

Our app consists of a React front-end (featuring some piecemeal use of React-Bootstrap) and a Firebase backend. The secret sauce for this app was the [React-pdf](https://react-pdf.org/) node package. After some configuration and plenty of experimentation, we had a pdf dynamically rendering in our window. Construction of the templates for resumes and cover letters was laborious, but pretty straight-forward. If I were to take another pass at this project, I'd really want to see if there were a means by which I could populate this document in a much DRYer approach.

I encourage you to checkout our repo and [deployed application](https://resume-render21.herokuapp.com/) to see our code and learn more about how this project came to life!

{% github Marcus-Guillermo/frontend %}
Part 4 video of pair programming a Perl web app
Tags: perl, mojolicious, pairprogramming, webdev
Published: 2021-04-26 13:46:20

---
title: Part 4 video of pair programming a Perl web app
published: true
date: 2021-04-26 13:36:43 UTC
tags: Perl,Mojolicious,pairprogramming,webdev
canonical_url: https://phoenixtrap.com/2021/04/26/part-4-video-of-pair-programming-a-perl-web-app/?utm_source=rss&utm_medium=rss&utm_campaign=part-4-video-of-pair-programming-a-perl-web-app
series: Live-coding a web app in Perl and Mojolicious
---

[Yesterday’s session video is up.](https://perlmaven.com/course-management-app-in-mojolicious-4)

{% youtube C4YYt0yh8_c %}

Does anyone have some tips on running [Devel::Cover](https://metacpan.org/pod/Devel::Cover) on a Mojolicious app while in development (i.e., no Makefile yet)? Mojolicious used to have a [`test` command](https://metacpan.org/pod/release/SRI/Mojolicious-7.94/lib/Mojolicious/Command/test.pm) that would help with this, but they [removed that in version 8.0](https://metacpan.org/changes/release/SRI/Mojolicious-8.0).
How to use Spring Batch Late Binding – Step Scope & Job Scope
Tags: springboot, springbatch, job, scope
Published: 2021-04-26 13:32:27

https://grokonez.com/spring-framework/spring-batch/use-spring-batch-late-binding-step-scope-job-scope

How to use Spring Batch Late Binding – Step Scope & Job Scope

<strong>Spring Batch Late Binding</strong> provides a solution for late binding <strong>Job's Parameters</strong> with <strong>Beans' properties</strong>. In the tutorial, <strong>JavaSampleApproach</strong> will introduce <strong>Spring Batch Late Binding</strong> cleary by a sample project.

Related Articles:
1. <a href="https://grokonez.com/spring-framework/spring-boot/use-spring-batch-inheritance-function">How to use Spring Batch Inheritance function</a>
2. <a href="https://grokonez.com/spring-framework/spring-boot/use-intercepting-job-execution-spring-batch">How to use Intercepting Job Execution in Spring Batch</a>
3. <a href="https://grokonez.com/spring-framework/spring-boot/start-spring-batch-using-spring-boot">How to start with Spring Batch using Spring Boot – Java Config</a>
4. <a href="https://grokonez.com/spring-framework/spring-boot/spring-batch-partition-scaling-parallel-processing">Spring Batch Partition for Scaling & Parallel Processing</a>

<!--more-->
<div id="tuttoc" class="jsa-toc"></div>

<div id="tutcontents">
<h2>I. Spring Batch Late Binding</h2>
See below configuration:
<pre><code class="language-html">&lt;!-- Abstract Parent Bean --&gt;
&lt;beans:bean id=&quot;parentBean&quot; abstract=&quot;true&quot;&gt;
	&lt;beans:property name=&quot;folder&quot; value=&quot;${folder}&quot;/&gt;
	&lt;beans:property name=&quot;fileName&quot; value=&quot;${inputFileName}&quot;/&gt;
&lt;/beans:bean&gt; </code></pre>

The configuration uses a traditional approach:<code>${folder}</code> & <code>${inputFileName}</code>
<strong>folder</strong> & <strong>inputFileName</strong> must define in a configuration file, like <strong>application.properties</strong>:
<pre><code class="language-html">
folder=C:\\readfile
inputFileName=1.txt
</code></pre>

<strong>Question</strong>: How to bind data between <strong>Job Parameters</strong> & <strong>Beans' properties</strong>?
<strong>Answer</strong>: <strong>Spring Batch Late Binding</strong> with Job & Step attributes.
<h3>1. Step Scope</h3>
Spring Batch provides various form for late binding with Step attributes:

https://grokonez.com/spring-framework/spring-batch/use-spring-batch-late-binding-step-scope-job-scope

How to use Spring Batch Late Binding – Step Scope & Job Scope
Vulnerability management tools - Stack Images
Tags: startup, kubernetes, docker, devops
Published: 2021-04-26 13:23:00

HyScale enterprise platform has pre-installed OS images. It provides an option to import distroless images as well from external and use it as a base image. Think of its structure as a stack of objects. OS image as a base, then stack image, and finally, application artifacts at the top level where the users take care of this stage.

If you take a deeper look at any microservice container image, there are broadly three categories of packages installed inside.

OS level packages – packages that come along with the chosen operating system
Stack packages – jdk, python, tomcat etc.
Application artifact – war files, jar files, python packages, go binary, etc. This is the variable part where the code resides