teleren/devto huggingface dataset:
Setup a CI/CD Pipeline For .Net Core With CircleCI
Tags: netcore, circleci, cicd
Published: 2019-07-26 17:36:35

---
title: Setup a CI/CD Pipeline For .Net Core With CircleCI
published: true
description: CircleCI setup for .net core
tags: .NetCore,CircleCI,CI/CD
---

CircleCI in recent years have shown their commitment in recent years in ensuring that they make the task of continous integration and delivery way more easier and fast for devs to setup. And amongst the many CI/CD tools in the market today, i think CircleCI have one of the easiest and straight forward approach. Making use of containers.

However with the list of programming languages they wrote convenience images for they somehow neglected .Net...anyways the joke is on them. I recently explored using them on a project, and came up with the following.


I dug into their convenience images and found out that they just basically have docker bundled with the language's base image.

So i was easily able to come up with one for .Net Core. i used .Net Core 3, but same approach should work on previous versions

{% github herocod3r/CircleCiDocker.Net %}

After building the image i pushed it to [Docker Hub](jetcipher/circleci-dotnet-core)

### Next step was to add my circle ci config file

Create a folder in the root directory of your file named _.circleci_ within it create a file called _config.yml_

then define the following

```
version: 2
jobs:
  build:
    docker:
      - image: jetcipher/circleci-dotnet-core:3.0
    steps:
      - checkout
      - run:
          name: Restore
          command: dotnet restore
          working_directory: MyProject.Api
      - run:
          name: Build
          command: dotnet build -c Release
          working_directory: MyProject.Api
      - run:
          name: Running Tests
          command: dotnet test
          working_directory: MyProject.Tests
      - setup_remote_docker:
          docker_layer_caching: true
      - run:
          name: Build and push Docker image
          command: |
            docker build -t MyProject .
            echo $DOCKER_PWD | docker login -u $DOCKER_LOGIN --password-stdin
            docker tag boku herocod3r/MyProject
            docker push herocod3r/MyProject
```

*MyProject* is your project's name, im sure you get the flow 🙂
On your CircleCI project's dashboard setup the enviroment variables *DOCKER_PWD* your docker password and *DOCKER_LOGIN* your docker id

Commit and push, voila your build should now be running !!
I created DEV and have other positive qualities, ask me anything!
Tags: ama, meta
Published: 2019-07-26 17:11:46

It's been a while since I did an AMA, and I'll be hanging around the site on support this weekend, so post some questions and I'll try to respond to a bunch today and over the weekend.

FYI: If you want to follow along, you may want to click the "three dots" in the actions menu and subscribe to `Post Author Comments` which will allow you to get notifications when I respond to comments here.

About me: I'm a coder from Canada. I live in the New York City area (no longer right in the city). I'm a semi-self-taught developer with a bit of formal CS education. I created this community and brought @jess and @peter on to help make it survive, thrive and grow as a business we could work on full-time.

Ask me anything!
Reversing a string using .from
Tags: javascript, programming
Published: 2019-07-26 16:20:16

---
title: Reversing a string using .from
published: true
description: 
tags: javascript, programming
series: reversing a string
---

I was rather hoping that this series would finish with `.some` but here we are again reversing a string. This time, we're using `Array.from()`.

This is the ES6 version
```javascript
const Bruce_ArrayFrom = (str, buf = []) => {
  Array.from(str, (itm) =>
    buf.unshift(itm)
  );
  return buf.join("");
}
```
and the ES3 version, thanks to [Babel](https://babeljs.io/repl#?babili=false&browsers=&build=&builtIns=false&spec=false&loose=false&code_lz=MYewdgzgLgBAQgJwK7AKYH0CCCEEMCeAYgiALYwC8MAFNAgDQwBGSAZpTANoC6AlJQD4YAbwBQMGNjz4AdKxKlaUBjQCWUUvwoDxE5mxlJIAC1Wso1dZt28A3LoSooSBGH2sZAKxCqw1AET-dqIAvkA&debug=false&forceAllTransforms=false&shippedProposals=false&circleciRepo=&evaluate=false&fileSize=false&timeTravel=false&sourceType=module&lineWrap=true&presets=es2015%2Ces2016%2Cstage-2%2Cflow&prettier=true&targets=&version=7.5.5&externalPlugins=)
```javascript
var Bruce_ArrayFromES3 = function Bruce_ArrayFromES3(str) {
  var buf =
    arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : [];
  Array.from(str, function(itm) {
    return buf.unshift(itm);
  });
  return buf.join("");
};

```
In terms of speed, both are awful, both sitting down the bottom of the list. Only the RegExp version is slower. Intriguingly, the ES3 version is slower than the ES6 (for reasons unknown.) 

Hopefully, that's the end of reversing strings with JavaScript. Like Perl, [there's more than one way to do it](https://en.wikipedia.org/wiki/There%27s_more_than_one_way_to_do_it) though some ways are better than others.
What was your win this week?
Tags: discuss, weeklyretro
Published: 2019-07-26 16:17:53

---
title: What was your win this week?
published: true
description: Got to all your meetings on time? Started a new project? Fixed a tricky bug?
tags: discuss, weeklyretro
cover_image: https://cl.ly/188e843c2985/download/Image%202019-02-15%20at%202.36.37%20PM.png
---

👋👋👋👋

Looking back on your week -- what was something you're proud of?

All wins count -- big or small 🎉

Examples of 'wins' include:

- Giving a talk
- Starting a new project
- Fixing a tricky bug
- Cleaning your house...or whatever else that may spark joy 😄

![party-parrot](https://media.giphy.com/media/l2Sq0X9PvGJZJ57Uc/giphy.gif)
Happy Friday!
English or Native Language Videos
Tags: discuss, tutorials
Published: 2019-07-26 16:15:45

---
title: English or Native Language Videos
published: true
description: What's best for reaching a wider audience
tags: discuss, tutorials
---

Hi!
I want to create some tutorials and live-coding sessions on Youtube. The audience's level should go from beginner to intermediate. I'm not fluent with english (I still struggle with pronunciation) so I'm wondering if I should go with my native language (which is Haitian Creole) or go with English for a wider audience.
Chef to Coder
Tags: welcome, newbie
Published: 2019-07-26 16:05:23

Hey internet people, just wanted to introduce myself and give a little backstory as to what I'm doing here. My name is Tim Mahoney and I am from the great state of New Jersey where I've been a professional chef for the past 20 years was laid off last October. Before I was laid off though I had already taken an interest in coding and was just going through the basics with some online learning apps. On my lunch breaks I'd use SoloLearn to help me get the gist of things like html, css and even some programming languages like java & python. Waaaaayyyy back in the day I used to work at a computer company that did a little bit of everything; pc sales, component sales in large quantities, R&D, I think they even dabbled in software for a bit. Unfortunately I was in my early 20's and didn't realize the potential of working in the IT industry, hey we all do dumb shit in our younger years. 

Fast forward to today and I'm currently on my second semester in community college working on my AAS degree in computer programming/computer science, working through @freecodecamp, taking a buttload of Udemy courses, I just attended Codeland earlier this week, & I've got a couple of mentors pushing me to get my first developer job. It's been a pretty wild ride, a few struggles here and there and even though I have the feeling of defeat at times there's always a little light shining at the end of the tunnel. The deeper I get, the brighter the light shines.
Learn to animate icons in Adobe XD 🎨
Tags: webdev, ux, design, tutorial
Published: 2019-07-26 15:56:20

In this tutorial we will look at the Auto-Animate feature and how simple it is to do beautiful animations in no time! 💥

Video is 9 minutes and should get you up and running with all cool kinds of animations 💡 🏆

And the best thing is that Adobe XD is free to download and use! 😍

https://www.adobe.com/products/xd.html

{% youtube F53x8OeKfOc%}
How millennials apply for jobs in 2019
Tags: jokes
Published: 2019-07-26 15:18:32

---
title: How millennials apply for jobs in 2019
published: true
description: Joke
tags: #jokes
---

<p>&ndash; University Grad: *applies to job posting </p>
<p>&ndash; Recruiter: "You have the right skills, we're just looking for someone with a bit more experience... </p>
<p>&ndash; University Grad: *downloads Face App age filter and syncs to their Linkedin picture</p>
<p>&ndash; Recruiter: "Wait a minute, I think we can make this work. When can you start?" 
</p>
😂😂
What conferences are you most excited about this fall?
Tags: discuss, devrel
Published: 2019-07-26 15:14:29

---
title: What conferences are you most excited about this fall?
published: true
description: 
cover_image: https://thepracticaldev.s3.amazonaws.com/i/2fuskahep7ahyi91kmjz.jpg
tags: discuss, devrel
---

I'm currently planning my calendar and I'd love to get some suggestions from the community. If you're running an event and looking to catch the eye of some potential attendees, feel free to share it here too.

I'm excited about [JAMstack Conf San Francisco](https://jamstackconf.com/sf/) on October 16-18. I just went to the London edition and loved it ❤️ Amazing speakers, several live product announcements from the likes of [Netlify](https://netlify.com/) and [Stackbit](https://stackbit.com/). Overall there was a really friendly and inclusive environment, and for me a lot of developer advocates, and evangelists, and founders of dev companies to connect with. The SF edition will be even bigger, with an additional day of conference in addition to a workshop day.

*Photo: [Sarah Drasner](https://twitter.com/sarah_edo) speaking at JAMstack Conf London 2019*
XPath locators with chrome devtools
Tags: chrome, selenium, xpath, testing
Published: 2019-07-26 14:50:15

---
title: XPath locators with chrome devtools
published: true
description: 
tags: chrome,selenium,xpath,testing
---
XPath is one of the choices for locators with Selenium but writing XPath by hand is also harder than it should be.

You can totally let Chrome devtools do it for you!

Find the element visually on the screen
Right and choose inspect
You should not be in Chrome dev tools and the html element should be highlighted.
Right click again on the light blue highlighted html element
Choose Copy and then Copy XPath

This is input box from google front page (with a gif example!)
```
//*[@id="tsf"]/div[2]/div/div[1]/div/div[1]/input
```

![](https://thepracticaldev.s3.amazonaws.com/i/cv9yhr3hyhkdofksmcey.gif)


XPath is not my first choice for locators in Selenium, I will usually favor ID and Name.

XPath is tied to the structure of the DOM. If the structure changes the XPath will also change and your tests will fail.

So if you are going to use XPath know that as your web developers make changes to your website you will have to monitor your tests.
Tell me about your favorite mobile games
Tags: discuss
Published: 2019-07-26 14:17:14

---
title: Tell me about your favorite mobile games
published: true
tags: discuss
---

almost every dev i know has a game they play on their mobile daily, i'm looking for new games so i want to know what you're currently playing.

to make things more organized, mention the name of the game and the platform(OS) you're currently playing it on.

i'm currently playing ENYO (android) and monument valley 2 (android).
component #10 - Audio Player
Tags: react
Published: 2019-07-26 13:45:32

---
title: component #10 - Audio Player
published: true
description: This is a part of *30 components / month* challenge.
tags: #react
---
{% codesandbox 2mwfn %}

## What I have learned?

- How to make a custom Audio Player.
- How to enjoy making a custom Audio Player by keeping it simple. :D

## What are the main challenges?

Converting the audio current time (seconds) into `00:00`. I was really having this silly thought of installing `momentjs` just to have my desired format. 😂😂 So instead of doing that I'd decided to pull out my primary lifeline (stackoverflow) yep, I even put the link to the solution below.

Overall this is a great experience of making a custom Audio player. 

## Why am I doing this anyway?

- To learn.
- To have fun.
- To future Joimee (for reference).

Resources:
[Format Audio Current Time](https://stackoverflow.com/questions/4605342/how-to-format-html5-audios-currenttime-property-with-javascript)
[HTMLMediaElement](https://developer.mozilla.org/en-US/docs/Web/API/HTMLMediaElement)
[component #3 Video Player](https://dev.to/oieeaaaa/component-3-video-player-lm6)


Salamat.
Random RGB
Tags: javascript, node, react
Published: 2019-07-26 13:44:08

Random RGB

![Random RGB](https://thepracticaldev.s3.amazonaws.com/i/okrl0rqbew1xdydls1ht.jpg)


Ao desenvolver alguma aplicação, você precisou por algum motivo gerar cores aleatoriamente?

Nessa dica de hoje, ou snippet, como você quiser chamar, vou mostrar uma função simples 
para criação de cores RGB usando JavaScript.

Estamos usando "arrow funcitions" para criar as funções e usando o "template strings" para concatenar 
a string.

Espero que seja útil em seus projetos.

Deixe seu like e compartilhe com seus amigos! 

Se tiver alguma sugestão de postagem, deixe nos comentários =)


Siga:

[instagram](https://www.instagram.com/emersonbrogadev/)
[youtube](https://www.youtube.com/c/emersonbroga/)
[facebook](https://www.facebook.com/emersonbrogadev/)
[twitter](https://www.twitter.com/emersonbrogadev/)
Daily Challenge #25 - Double Cola
Tags: challenge
Published: 2019-07-26 13:32:02

---
title: Daily Challenge #25 - Double Cola
published: true
series: Daily Challenge
description: A vending machine from a different dimension has a riddle for you. 
tags: challenge
---

Today's [otherworldly soda machine](https://www.codewars.com/kata/551dd1f424b7a4cdae0001f0) comes from AlexIsHappy on CodeWars.

>Sheldon, Leonard, Penny, Rajesh and Howard are in the queue for a "Double Cola" drink vending machine; there are no other people in the queue. The first one in the queue (Sheldon) buys a can, drinks it and doubles! The resulting two Sheldons go to the end of the queue. Then the next in the queue (Leonard) buys a can, drinks it and gets to the end of the queue as two Leonards, and so on.

>Write a program that will return the name of the person who will drink the n-th cola. 

> For example, Penny drinks the third can of cola and the queue will look like this: ` Rajesh, Howard, Sheldon, Sheldon, Leonard, Leonard, Penny, Penny `

> The input data will consist of an array containing at least one name and a single integer `n`. Return the single line - the name of the person who drinks the n-th can of cola. The cans are numbered starting from 1.

>`who_is_next(["Sheldon", "Leonard", "Penny", "Rajesh", "Howard"], 1) == "Sheldon"`
`who_is_next(["Sheldon", "Leonard", "Penny", "Rajesh", "Howard"], 52) == "Penny"`
`who_is_next(["Sheldon", "Leonard", "Penny", "Rajesh", "Howard"], 7230702951) == "Leonard"`

What a weird queue, this one's pretty different from some of the other challenges.
Good luck!

***
_Thank you to [CodeWars](<https://codewars.com/>), who has licensed redistribution of this challenge under the [2-Clause BSD License](<https://opensource.org/licenses/BSD-2-Clause>)!_

_Want to propose a challenge for a future post?  Email **yo+challenge@dev.to** with your suggestions!_
AWS CDK and asynchronous requirements
Tags: aws, functional, typescript, devops
Published: 2019-07-26 13:24:52

I have moved my infrastructure definitions to TypeScript and enjoy having the entire stack in the same language.

For the Lambda functions, I want to compile and bundle the code at deployment. 

I started out defining the stack using inheritance, as the CDK documentation's "Getting Started" page. This quickly showed some difficulties, as Webpack's compiler runs asynchronously, and object constructors do not. 

I changed over to a more functional approach of building the stack. Instead of inheriting from `cdk.Stack`, I instantiate it and pass the object to resources as normally.

{% gist https://gist.github.com/mamaar/756960de31cfe51bd20bf46848fb0b0f file=stack.ts %}

{% gist https://gist.github.com/mamaar/756960de31cfe51bd20bf46848fb0b0f file=app.ts %}

I have taken the same approach on a couple of custom CloudFormation resources with success. Now I am looking forward to the future of programming my AWS stack and not statically defining it.
Resources to become a developer
Tags: opensource
Published: 2019-07-26 13:12:09

If you love developing applications and website. Here the major different resources that help you to become a developer. After completing your studies, what next to do now? A career as a developer is really very interesting and challenging. 

Here, the article tells you about some resources which are really useful to your career as a developer.
Although, it is really important to give your 100% to your work and for that, the first resource is YOU and your self-discipline.
For coders also it is not easy to handle the stress and pain of failure or rejection, but being upset with this is not good. So these resources are to build yourself to the Top coder.

Click here to read complete article:- https://codersera.com/blog/%ef%bb%bfresources-to-become-a-developer/
Capturing Web Cam Pictures with .net
Tags: uncategorized, code
Published: 2019-07-26 18:58:12

---
title: Capturing Web Cam Pictures with .net
published: true
tags: Uncategorized,code
canonical_url: 
---

So I recently was working on a project where we needed to be able to have a web cam on a laptop take pictures, and then send those images against a web api endpoint.

Basically the use-cases behind this are plenty, but this was around work done to support using Microsoft Cognitive services. The project itself being a slimmed down version of the intelligent kiosk from Microsoft.

So I have to be honest, I expected this problem to be a lot harder than it actually is. There is a great library that made this work called AForge.Video, that I was able to install from nuget, and from there this is the code required:

```
static void Main(string[] args) { // enumerate video devices var videoDevices = new FilterInfoCollection( FilterCategory.VideoInputDevice); // create video source VideoCaptureDevice videoSource = new VideoCaptureDevice( videoDevices[0].MonikerString); // set NewFrame event handler videoSource.NewFrame += new NewFrameEventHandler(video\_NewFrame); videoSource.ProvideSnapshots = true; // start the video source videoSource.Start(); //videoSource.SignalToStop(); Console.ReadLine(); }
```

The above code is just identifying the video / photo capture devices available on this machine, and leveraging the first. And then connecting an event to handle new frame capture.

From there, once I turn on “videoSource.Start();” the application starts executing the NewFrameEventHandler to process it.

```
private static void video\_NewFrame(object sender, NewFrameEventArgs eventArgs) { // get new frame Bitmap bitmap = eventArgs.Frame; var fileName = @"C:\temp\camera\File\_Frame.jpg"; //bitmap.Save(string.Format(fileName)); EncoderParameters encoderParameters = new EncoderParameters(1); encoderParameters.Param[0] = new EncoderParameter(System.Drawing.Imaging.Encoder.Quality, 100L); bitmap.Save(fileName, GetEncoder(ImageFormat.Jpeg), encoderParameters); var bytes = bitmap.ToByteArray(ImageFormat.Bmp); Thread.Sleep(1000); }public static ImageCodecInfo GetEncoder(ImageFormat format) { ImageCodecInfo[] codecs = ImageCodecInfo.GetImageDecoders(); foreach (ImageCodecInfo codec in codecs) { if (codec.FormatID == format.Guid) { return codec; } } return null; }
```

Now the event handler above will take the code, and extract the bitmp, convert it to a Jpg and save the file. But additionally I’ve added the logic at the end to convert it to a byte array. This would allow you to push this up to an HTTP endpoint for processing by any services you need. Pretty simple for 74 line of code.
Using Vuex in Vue.js
Tags: vue, vuex, javascript, frontend
Published: 2019-07-26 13:00:43

While using vuejs with vue what I find very important is dividing states into modules. eg: auth module, user module, status module, post module. each with their own state, actions, mutations, and getters.

for more, I recommend referring the following video: https://www.youtube.com/watch?v=5lVQgZzLMHc

you can also check the official documentation for more at https://vuex.vuejs.org/guide/modules.html
Implement dragging and resizing in JS
Tags: javascript, html, css
Published: 2019-07-26 12:56:58

Recently I decided to implement dragging and resizing of an object using vanilla JavaScript. I think many people use libraries to handle this type of functionality since it's easy and it works. 

Well anyway, if you want to have a look at how it's implemented from scratch, I made a short 2-part YouTube video series. In part 1 we make a div shaped as a square movable and in part 2 we extend the implementation and make it re-sizable in 4 different directions!

You'll realize the implementation of the two is similar since we are interested in the x and y coords of the mouse at the start of holding mouse button down and as we move it.

Here's the video: 

<a href="http://www.youtube.com/watch?feature=player_embedded&v=NyZSIhzz5Do" target="_blank"><img src="http://img.youtube.com/vi/NyZSIhzz5Do/0.jpg" alt="JavaScript" width="240" height="180" border="10" /></a>

If you have any comments on the code, I'd love to hear them.

Note: Not super experienced uploading stuff to YouTube and speaking on video, so definitely some areas that could use some improvement 🐼