teleren/devto huggingface dataset:
Collab Lab Week 6 - What happens when we need more time?
Tags: collablab, codenewbie
Published: 2020-01-20 09:06:15

My last post about The Collab Lab was back in week 4. It has been an interesting past few weeks.

It seemed like for all of us week 4 and 5 were intense in areas outside of our collab lab commitment. Neither pair was able to satisfy their story or get our pull request merged by the end of the week. Many of the mentors had a company retreat.

I think it was around Saturday when I realized it wasn't going to happen. Past me (probably as recent as two years ago) would have freaked out and stressed about it. I was pleased with my mental response to what felt like falling short of expectations.

I thought, this is a great learning opportunity and this is what we're here for. Andrew wasn't going to call it off and cancel the project. I knew that much. I knew it would be handled in a professional and reasonable way. I knew we weren't "in trouble."

A common theme in what I've learned so far is that effective and frequent communication is just about the most important skill I'm building as a part of this cohort.

We all got stuck, then everything was really quiet.

It's important to communicate (and push code) when you're stuck. Git is an amazing tool that allows us to time travel through code. I'm finding that the more comfortable I get with Git, the more willing I am to try things without fear of messing it up.

I don't remember which of the mentors said this, but someone a few weeks back said, "branches are free." I put that advice into practice with this last story.

Things got messy and frantic with my code as I was trying to debug it and make it fit with my partner's work. I decided to go back to when we had everything working but not yet connected and made a fresh branch. It was much easier to think it through and get to a working solution.

The working solution was still messy and hacked together but then our mentor, Steve left an [awesome code review](https://github.com/the-collab-lab/tcl-3-smart-shopping-list/pull/53#pullrequestreview-344951025). 

I don't talk a lot about the programming and the React stuff that I'm learning, but I'm learning so much. I feel like I leveled up by refactoring the code with Steve's suggestions. How amazing it is to have access to someone who *knows* React.

I tweeted about it, a little bit (before the level up)
{% twitter 1218641685661356032 %}

Part of what was hard and time-consuming with this story is I had to learn new stuff and then turn around and implement what I'd just learned. I'm grateful that I know my learning style and I have access to great resources and knowledgable mentors.

This is absolutely my favorite way to learn. With context, for a reason, and with awesome people is great for intrinsic motivation.
How to install Next.js?
Tags: react, nextjs, javascript
Published: 2020-01-20 08:58:50

How to install Next.js?

I wrote this tutorial to help you quickly learn Next.js and how to install with cli.

It's ideal for you if you have zero to little knowledge of Next.js, you have used React in the past, and you are looking forward diving more into the React ecosystem, in particular server-side rendering.
I find Next.js an awesome tool to create Web Applications, and at the end of this post I hope you'll be as excited about it as I am. And I hope it will help you learn Next.js!

How to install Next.js?
To install Next.js, you need to have Node.js installed.

Make sure that you have the latest version of Node. Check with running node -v in your terminal, and compare it to the latest LTS version listed on https://nodejs.org/.

After you install Node.js, you will have the npm command available into your command line.

Using create-next-app
If you're familiar with create-react-app, create-next-app is the same thing - except it creates a Next app instead of a React app, as the name implies.

I assume you have already installed Node.js, which, from version 5.2 (2+ years ago at the time of writing), comes with the npx command bundled. This handy tool lets us download and execute a JavaScript command, and we'll use it like this:

<code>npx create-next-app</code>

The command asks the application name (and creates a new folder for you with that name), then downloads all the packages it needs (react, react-dom, next)


and you can immediately run the sample app by running <code>npm run dev</code>

And here's the result on http://localhost:3000:
massCode – An open source code snippets manager is out to v1
Tags: vue, electron
Published: 2020-01-20 08:56:55

---
title: massCode – An open source code snippets manager is out to v1
published: true
description: An open source code snippets manager
tags: vue, electron
---

Hi there,

massCode developer here.

I am excited to introduce my app.

The goal of creating this application was mostly my own growth as a developer. Also, I wanted this project to absorb the best of such applications already on the market (both free and paid). At the same time, I wanted this project to be an open source project.

The main feature is a modern editor - Monaco, which is used in VS Code. Among the advantages of the editor are rich IntelliSense, validation for TypeScript, JavaScript, CSS, LESS, SCSS, JSON, HTML. For more productivity, Emmet was added.

The next feature is the tray assistant, which can be called with the help of hotkeys, thus having quick access to the snippets collection from any application.

I'll be glad to hear your feedback!

https://masscode.io/

{% github antonreshetov/massCode %}
has anyone got any wine success stories ?
Tags: discuss, wine
Published: 2020-01-20 08:55:52

pretty please ? even something simple that actually RUNS in [wine](https://www.winehq.org/) ? 

the furthest ive ever got is installing [wine](https://www.winehq.org/)

![linuxliteos wine](https://thepracticaldev.s3.amazonaws.com/i/vegjeevvabup435u07dl.png)

ok so i cheated linuxliteos comes with wine presinstalled
Links of the week (3)
Published: 2020-01-20 08:42:31

* https://locusmag.com/2020/01/cory-doctorow-inaction-is-a-form-of-action/
A long piece on technology, policy, and democracy.
* https://blog.letsenhance.io/all/2019/07/09/computational-photographyfrom-selfies-to-black-holes/ Another long piece, on computational photography. After reading this, I started to respect cellphone cameras/photography and their improvement over time.
* https://github.com/cosmicpython/book#table-of-contents An interesting book (in the open) on application design in Python.
AWS AI & Machine Learning Podcast — Episode 6
Tags: aws, machinelearning, podcast
Published: 2020-01-20 14:42:54

---
title: AWS AI & Machine Learning Podcast — Episode 6
published: true
date: 2020-01-20 08:23:05 UTC
tags: aws,machinelearning,podcast
canonical_url: https://medium.com/@julsimon/aws-ai-machine-learning-podcast-episode-6-e7e3c9025eec
---

### AWS AI & Machine Learning Podcast — Episode 6

In this episode, I have a chat with Cosmin Catalin Sanda, a Data Science Engineer for [AudienceProject](https://www.audienceproject.com). We talk about real life ML, what it takes for ML projects to be successful (experimentation, agility, intuition, etc.), how SageMaker helps, and more.

> Video episodes are available on my [YouTube channel](https://www.youtube.com/juliensimonfr).

> Audio episodes are available on [Apple Podcasts](https://podcasts.apple.com/us/podcast/aws-ai-machine-learning-podcast/id1492801210), [Spotify,](https://open.spotify.com/show/1argBtYSeSksGU8dcW4TAS) [Deezer](https://www.deezer.com/show/756292), and more. Visit my [audio podcast page](https://julsimon.buzzsprout.com/) to subscribe and be notified of future episodes.

{% youtube YqRd4Gh9a98 %}

<iframe src="https://cdn.embedly.com/widgets/media.html?src=https%3A%2F%2Fwww.buzzsprout.com%2F780458%2F2525080-episode-6%3Fclient_source%3Dtwitter_card%26player_type%3Dfull_screen&amp;url=https%3A%2F%2Fwww.buzzsprout.com%2F780458%2F2525080&amp;image=https%3A%2F%2Fwww.buzzsprout.com%2Frails%2Factive_storage%2Frepresentations%2FeyJfcmFpbHMiOnsibWVzc2FnZSI6IkJBaHBBOGpKZFE9PSIsImV4cCI6bnVsbCwicHVyIjoiYmxvYl9pZCJ9fQ%3D%3D--c836266b57e2bc68585d743589ac963f73619fc3%2FeyJfcmFpbHMiOnsibWVzc2FnZSI6IkJBaDdCam9VWTI5dFltbHVaVjl2Y0hScGIyNXpld282QzNKbGMybDZaVWtpRFRJMU1IZ3lOVEJlQmpvR1JWUTZER2R5WVhacGRIbEpJZ3RqWlc1MFpYSUdPd2RVT2d0bGVIUmxiblJKSWd3eU5UQjRNalV3QmpzSFZEb01jWFZoYkdsMGVXbFZPZzlqYjJ4dmNuTndZV05sU1NJSmMxSkhRZ1k3QjFRPSIsImV4cCI6bnVsbCwicHVyIjoidmFyaWF0aW9uIn19--62c0dc9ae0106a9121f982eb952976ff55ebdee3%2Fbackground.jpg&amp;key=a19fcc184b9711e1b4764040d3dc5c07&amp;type=text%2Fhtml&amp;schema=buzzsprout" width="500" height="210" frameborder="0" scrolling="no"><a href="https://medium.com/media/78f5a1d6753af2b46501e16ff14006cb/href">https://medium.com/media/78f5a1d6753af2b46501e16ff14006cb/href</a></iframe>
AR what is it good for
Tags: ar, ai, vr, mktg
Published: 2020-01-20 08:14:08

i think i mentioned before that ai, ar and vr are at the bottom of my todo list but i could buy into this use of ar in retail #fashionmirror

https://twitter.com/evankirstel/status/1217464457913237505?s=19

{% twitter 1217464457913237505 %}

btw @evankirstel is at the very top of my list of tech tweeters
Add and Delete Layers in PDF in Java
Tags: java, pdf, layer
Published: 2020-01-20 08:05:23

---
title: Add and Delete Layers in PDF in Java
published: true
description: This article demonstrates how to add and delete layers in PDF documents in Java.
tags: java, pdf, layer
---
PDF layers allow users to selectively hide or show the content appearing on them in PDF documents. In this article, we will introduce how to add layers to a PDF document, draw content to the layers and delete a specific layer in Java using [Free Spire.PDF for Java library](https://www.e-iceblue.com/Introduce/free-pdf-for-java.html).

Before getting started, please download Free Spire.PDF for Java package through [this link](https://www.e-iceblue.com/Download/pdf-for-java-free.html), unzip the package and then import Spire.Pdf.jar from lib folder into our application.

###Add layers to a PDF###

In the below example, we will learn how to add two layers to a PDF document and draw the content of a PDF page and an image to the layers. 
```java
import com.spire.pdf.PdfDocument;
import com.spire.pdf.PdfPageBase;
import com.spire.pdf.graphics.*;
import com.spire.pdf.PdfPageSize;
import com.spire.pdf.graphics.layer.PdfLayer;

import java.awt.*;
import java.awt.geom.Point2D;

public class AddLayers {
    public static void main(String[] args) throws Exception {

       //Create a new PDF document
        PdfDocument target = new PdfDocument();
        //Add a page
        PdfPageBase page = target.getPages().add();

        //Load an existing PDF document
        PdfDocument pdf = new PdfDocument();
        pdf.loadFromFile("Instruction.pdf");
        //Create a template of the first page in the PDF
        PdfTemplate template = pdf.getPages().get(0).createTemplate();

        //Add a layer to the new created PDF
        PdfLayer layer1 = target.getLayers().addLayer("Layer 1");
        PdfCanvas canvas1 = layer1.createGraphics(page.getCanvas());
        //Draw the template to the layer
        canvas1.drawTemplate(template, new Point2D.Float(20,50), PdfPageSize.A4);

        //Add a layer to the new created PDF
        PdfLayer layer2 = target.getLayers().addLayer("Layer 2");
        PdfCanvas canvas2 = layer2.createGraphics(page.getCanvas());
        //Draw an image to the layer
        canvas2.drawImage(PdfImage.fromFile("Hydrangeas.jpg"), new Point2D.Float(330,125), new Dimension(200, 130));

        //Save the resultant document
        target.saveToFile("result.pdf");
    }
}
```
###Delete a specific layer###

The below example shows how to remove a specific layer along with its content from a PDF document.
```java
import com.spire.pdf.PdfDocument;

public class DeleteLayer {
    public static void main(String[] args){
        //Load the PDF
        PdfDocument pdf = new PdfDocument();
        pdf.loadFromFile("result.pdf");

        //Remove the layer named "Layer 1" and its content from the PDF
        pdf.getLayers().removeLayer("Layer 1", true);

        //Save the resultant document
        pdf.saveToFile("deleteLayer.pdf");
        pdf.close();
    }
}
```
Easily select h1, h2, ... through SCSS functions
Tags: css, scss, metaprogramming, styling
Published: 2020-01-20 08:05:14

I was writing styles for formatting inside a rich-text web component. 

There, due to limitations of the CMS and requirements, we wanted all `h1`, `h2`, ... `h6` tags to have some similar presentations. 

Also, we had selectors like this:

```css
h1 + p, 
h2 + p, 
/*...*/
h6 + p { 
  /*...*/ 
}
```

Always writing selectors for all cases including all `h#` tags is a nightmare. It's hard to maintain, too. So I decided to look into how to fix this in the simplest way, while still complying to different use cases.

After going through forums and finding similar solutions, this is my end `.scss` code:

`selector-helpers.scss`:

```scss
/**
 *  Select any range in {h1, h2, h3, h4, h5, h6}.
 * 
 *  e.g. usage
 *    #{headings('', 1, 6, '.--attr')} { ... }
 */

@function headings($before:'', $from:1, $to:6, $after:'') {
    @if $from == $to {
        @return '#{$before} h#{$from}#{$after}';
    } @else {
        @return '#{$before} h#{$from}#{$after}, ' + headings($before, $from+1, $to, $after);
    }
}
```

Usage in `x-rich-text.scss`:

```scss
@import "./selector-helpers";

x-rich-text {

    // h1, ...
    #{headings()} {
        /* ... */
    }

    // h1:first-child, ...
    #{headings($after:':first-child')} {
        /* ... */
    }

    // h1 + p, ...
    #{headings($after:' + p')} {
        /* ... */
    }

    // h1, h2 (only)
    #{headings($from:1, $to:2)} {
        /* ... */
    }

    // img + p, ...
    #{headings($before:'img + ')} {
        /* ... */
    }

    // h1.--dark, h2.--dark, ...
    #{headings($after:'.--dark')} {
        /* ... */
    }

    // h1 code, h2 code, ...
    #{headings($after:' code')} {
        /* ... */
    }
}
```

I believe this can handle all cases with prefixes, suffixes and selective ranges in `1..6`.

So yeah. `:)` Hope this helps you! Let me know if there's a better way of handling this.
Parsing an OpenAPI file (Swagger)
Tags: java, swagger
Published: 2020-01-20 07:57:24

---
title: Parsing an OpenAPI file (Swagger)
published: true
description: We go though how to read a OpenAPI specification with the old API reading body content. And we also translate it to the new V3 parser and go through how this differens and works.
tags: java, swagger
cover_image: https://thepracticaldev.s3.amazonaws.com/i/oiui3sql2fq9zoacq02t.jpg
---

{% youtube bD2izGtpkGI %}

We go though how to read a OpenAPI specification with the old API reading body content. And we also translate it to the new V3 parser and go through how this differens and works.
Getting Started with Istio
Tags: kubernetes, servicemesh, istio
Published: 2020-01-20 07:56:52

The last few years have brought about immense changes in the software architecture landscape. A major shift that we have all witnessed is the breakdown of large monolithic and coarse-grained applications into fine-grained deployment units called _microservices_, communicating predominantly by way of synchronous REST and gRPC interfaces, as well as asynchronous events and message passing. The benefits of this architecture are numerous, but the drawbacks are equally evident. Aspects of software development that used to be straightforward in the 'old world', such as debugging, profiling and performance management, are now an order of magnitude more complex. Also, a microservices architecture brings its own unique challenges. Services are more fluid and elastic, and tracking of their instances, their versions and dependencies is a Herculean challenge that balloons in complexity as the service landscape evolves. To top this off, services will fail in isolation, further exacerbated by unreliable networks. Given a large enough system, parts of it may be suffering a minor outage at any given point in time, potentially impacting a subset of users, quite often without the operator's awareness. With so many 'moving parts', how does one stay on top of these challenges and ensure the system is running smoothly without impacting the customer and driving the developers out of their wits?

With the increased adoption of microservices, the industry has been steadily coming up with patterns and best-practices that have made the entire experience more palatable. _Resiliency Patterns_, _Service Discovery_, _Container Orchestration_, _Canary Releases_, _Observability Patterns_, _BFF_, _API Gateway_... These are some of the concepts that practitioners will employ to build more robust and sustainable distributed systems. But these concepts are just that — abstract notions and patterns — they require _someone_ to implement them _somewhere_ in the system. More often than not, that 'someone' is _you_ and 'somewhere' is _everywhere_.

[Read the rest of the article on Medium](https://medium.com/swlh/getting-started-with-istio-524628c025)
Scrolling effect
Tags: codepen, scrolleffect, htmlcss, javascript
Published: 2020-01-20 07:53:49

---
title: Scrolling effect
published: true
tags: codepen, scroll effect, HTML/CSS, javascript
---

Hi, coding people 🙋🏻‍♂️✋🏻

As you might know, my name is [Atul](atulprajapati.in/) and I write articles about coding, freelancing and most of Web. Now in this post, I have created a scrolling effect with just simple HTML, CSS and vanilla javascript.

free source code available on [Codepen](https://codepen.io/atulcodex)

So please check out and ask for any help or query related to code 🥽🏊🏻‍♂️


{% codepen https://codepen.io/atulcodex/pen/bGNQgOa %}
Install composer in custom Docker image
Tags: docker, php
Published: 2020-01-20 07:53:37

---
title: Install composer in custom Docker image
published: true
description: Install software in Docker with multi-stage builds
tags: docker, php
---

Before Docker 17.05 dropped mid-2017, installing software inside a custom Docker image followed the same process as installing it on the host. 

For example, you can install *composer* to */usr/local/bin* on a desktop by running the following *curl* command as **root**.

```bash
curl -sS https://getcomposer.org/installer | php -- --install-dir=/usr/local/bin --filename=composer
```

To install it in a custom Docker image just prepend "RUN" and stick it into a Dockerfile:

```yml
# Dockerfile
FROM php:7.4.1-fpm
# Install Composer
RUN curl -sS https://getcomposer.org/installer | php -- --install-dir=/usr/local/bin --filename=composer
```

### Watch

{% asciinema 294076 %}

**Ta-da!**

It works, but it relies on *curl* and an internet connection. Docker 17.05 brought a cleaner, less *curl-y*, *internet-y* way.

## Multi-stage builds and COPY

Simply replace the RUN instruction with the COPY instruction seen below.

You can see that we are copying from the [*composer*](https://hub.docker.com/_/composer) image from **/usr/bin/composer** to **/usr/bin/composer** in the new image.

Now let's see it in action, (as documented at https://hub.docker.com/_/composer):

```ymlhttps://docs.docker.com/engine/reference/builder/#copy
# Dockerfile
FROM php:7.4.1-fpm
# Install Composer
COPY --from=composer /usr/bin/composer /usr/bin/composer
```

### Watch

{% asciinema 294077 %}

**Ta-da*2!**

I hope this helps someone.
I talked 🗣🎙about my DEV article at BerlinJS(Germany 🇩🇪)
Tags: javascript, react, node, testing
Published: 2020-01-20 07:52:08

A few weeks back, I wrote an Article on DEV titled <b> 100% test coverage is not enough...</b>

A lot of people liked it and It became one of the <b>*TOP 7*</b> Most Popular Articles that week 🙌 :heart: 🚀

This is the Article if you missed it -
{% link https://dev.to/ebaytechberlin/100-test-coverage-is-not-enough-16d1 %}

I thought to talk about the concept of what I personally feel very important for any application.

<h3>So, I decided to talk about the concept at BerlinJS 🤖</h3>

![Alt Text](https://thepracticaldev.s3.amazonaws.com/i/m8vcm2detj1ieotzy9ip.jpg)


![Alt Text](https://thepracticaldev.s3.amazonaws.com/i/miqys4dryxhuovlpby4e.jpg)


That was such an awesome event! Thanks for having me BerlinJS!

Cheers!
👋
The lifestyle of the digital nomad
Tags: remote
Published: 2020-01-20 07:49:04

<a href="https://www.buymeacoffee.com/peacefullatom" target="_blank"><img src="https://cdn.buymeacoffee.com/buttons/default-orange.png" alt="Buy Me A Coffee" style="height: 51px !important;width: 217px !important;" ></a>

Among many perks of a remote lifestyle, there is one that fits many - you can be a digital nomad.

If you are a part of a distributed team and have a dream to explore the world, then it is an awesome combination!

This set of opportunities will allow you to:
- Seek inspiration.
- Meet new people.
- Learn new languages.
- Attend conferences.
- Explore the world!

And it doesn't matter which is your role in the team: chief, developer, public relations, designer, representative of any kind, etc.

If your activities are bound to some sophisticated set of equipment that you're unable to carry around, you still can spend part of your time as a nomad.

And it also will include everything from the above list.

The important thing is that your time is under your control.

> Explore the world - express yourself!
How to check what code is currently running in your lambda when UI Console does not allow viewing or editing it
Tags: aws, debugging, commandline, tips
Published: 2020-01-20 07:35:32

---
title: How to check what code is currently running in your lambda when UI Console does not allow viewing or editing it
published: true
description: quick tip to download the currently deployed lambda code
cover_image: https://thepracticaldev.s3.amazonaws.com/i/rco6410iaclw7dn61rrz.png
tags: #aws, #debugging, #commandline, #tips
---

Have you ever been debugging a Lambda function and just after checking CloudWatch for the logs, you went to the UI console to see what the Lambda is doing at a specific line and found out you can´t see anything?

![Your Lambda is too big](https://thepracticaldev.s3.amazonaws.com/i/egfr35wlcvzw1p3qur6j.png)

Of course, I am _NOT_ saying you should be fiddling with the code directly on the console and deploy to production straight away, but sometimes it is handy to at least see what it´s running, especially if on your git master the code contains already a lot of new feature-merges.

###What is running in the lambda? When and what was deployed last? 
(Spoiler: Tagging every deployment in Git, also helps)

If you are using Node and your lambda is not huge (normally we choose single purposed lambdas - something like one per endpoint ) you should definitely be able to see the code in the console.  But, especially if you have lots of dependencies, **it is easy to reach the [3M limit](https://docs.aws.amazon.com/lambda/latest/dg/limits.html)** and having the console just showing the following warning:  

> "The deployment package of your Lambda function "xyz" is too large to enable inline code editing. However, you can still invoke your function."

###How can you check that code then?

The console does not allow you to see it, and it does not provide you with any button do download the content of the lambda.

What to do?  

Well,  just use `aws lambda get-function` [cli command](https://docs.aws.amazon.com/cli/latest/reference/lambda/get-function.html).
 
If you try that though, it is a bit disappointing because it just returns all information about the function or function version, with a link to download the deployment package that's valid for 10 minutes, and that means you need to copy that link and navigate to it, to find out you don´t see any code... or you can **pipe that URL directly to curl to stuff the data into a zip file**!

```
aws lambda get-function --function-name YOUR_FUNCTION_NAME --query 'Code.Location' 
| xargs curl -o YOUR_FUNCTION_NAME.zip
```
Then it´s just a matter of `unzip YOUR_FUNCTION_NAME.zip` and you have the folder with all the content of the deployed package!

Happy debugging.

![happy debugging](https://media.giphy.com/media/rOlt3OtEdSc1O/giphy.gif)

---
Photo by [Dmitry Ratushny](https://unsplash.com/@ratushny?utm_source=unsplash&utm_medium=referral&utm_content=creditCopyText) on Unsplash