teleren/devto huggingface dataset:
Symfony unit tests with Redis on GitLab
Tags: devops, symfony, redis
Published: 2020-07-03 07:59:05

I've written a few times about GitLab and the CI/CD pipeline features it has.  For most cases, it's straightforward to use.  But, every so often, things don't always work as easily as the documentation makes out.

A project I'm working on uses [Symfony components](https://symfony.com/components), and has elements which use [Redis](https://redis.io/) to aid performance.  They work great, that's not the issue.  Unit testing is, however.  Especially on GitLab.

GitLab has documentation on [how to use Redis with the CI pipeline](https://docs.gitlab.com/ee/ci/services/redis.html), but it is a general document to point in the right direction.  It's not possible to cover all languages and implementations which may be required by people.  Which is where I came unstuck.

The main thing to be aware of is that using the Redis service is the best way of doing this.  Trying to install redis on the docker image let to "could not connect" errors and more failures.

Symfony's [documentation for the Redis adapter](https://symfony.com/doc/current/components/cache/adapters/redis_adapter.html) is pretty good.  The combination of the documentation there and Gitlab's documentation for Redis give the total solution.

Gitlab say to use the host for Redis as `redis`.  Symfony has the Redis URLs documented as being `redis://host:port` for the most part, except for this little nugget:

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

The port isn't always required.  It's also worth noting that Symfony fails to connect to Redis unless the host is prefixed `redis://`.  Combine the two documents and the host URL for unit testing Redis components in Gitlab is simply:
`redis://redis`

Took a bit of trial and error, but I finally got there.  Unit tests are now passing, and I'm hoping I don't have to make any other changes to the CI for a while now.  Just back to coding.

---
This article was originally posted on my blog at https://www.garybell.co.uk/symfony-unit-tests-with-redis-on-gitlab/ on  5th February 2020
Coding bootcamp final project: 'Run, Boris Run!' 🏃💨 

Tags: javascript, codenewbie, html, showdev
Published: 2020-07-03 07:43:44

I AM OFFICIALLY A CODING BOOTCAMP GRAD WOOOO! 🥳

I learnt how to develop a 2d platform game in pure vanilla JavaScript as part of a my final bootcamp project at Makers Academy.

It's not perfect but I'm super proud of all I've accomplished with my team over the past two weeks.

You can play here if you're interested: https://run-boris-run.netlify.app
How to Launch Your Own OTT Video Platform in 2020?
Published: 2020-07-03 07:13:29

In this fasting moving digital world, people prefer the internet and OTT Platforms like Netflix, Amazon Prime for Watching Movies, TV Shows, etc. OTT Platforms has huge potential. Video streaming Apps have been on the rise globally through recent years. Thus Launching a Video Streaming App for your business will pay you greater Revenue with lesser Investment.

If you would like to build a Video Streaming App like Netflix and enter into this quickly-growing technology on the online video industry. This exclusive guide will help you to **launch your own OTT Video App** to take your video streaming service business to great success.

##OTT Video Apps

OTT Video Apps is a Video streaming App service that offers Video content directly to users via the Internet straight on their various devices such as Mobile Devices, Smart TVs, Digital Media Players, Personal Computers, 

Some of the Popular OTT streaming platforms are Netflix, Amazon Prime Video, and Hulu,

##Different Monetization Model for Your VOD Business

SVOD: Subscription Video on Demand 
TVOD: Transactional Video on Demand
AVOD: Advertising based Video-on-demand

##Must-have Features in an OTT Video App Development

Multilingual Content
Search Bar
User profile 
Watchlist
Push Notifications
Social Features
Multiple Device Support

##How to Launch Your Own Video Streaming Apps like Netflix, HULU, Amazon Prime?

I hope, now you are clear about What is OTT Apps, Features of OTT Apps, and benefits of Building and Launching an OTT Video App. Then this will be the exact query that rolls up in your mind.**"Where to get the best OTT Video Streaming App?"**. No worries.  You are on the right path.

You can get in touch with the best [OTT App Development](https://www.employcoder.com/ott-app-development) Company. They will take care of everything from gathering requirements, OTT Platform Development to Design to migration, testing, and support

We **Employcoder** are the leading [OTT Video App Development Company](https://www.employcoder.com/ott-app-development) that delivers scalable and Feature Rich live video streaming apps. Our developers are good at developing scalable OTT Apps with attractive functionalities. We provide the best OTT Video Streaming App development with enhanced features at down to earth cost and on-time delivery.
Name this software, opinion needed.
Tags: help
Published: 2020-07-03 07:12:36

I'm working on something called Unpack, this is a provisional name that hopefully explains that is unbundles common JS to ESM and builds a front end without bundles (working prototype in repo, not sharing today). However I would like Unpack to be the Deno of the front end and also help the Deno comunity to convert common.js to es_modules so I have thought of another name which would lead to similar branding to Deno.

didi.

What do you think? Didi is a smaller dinosaur 🦖.

I suspect that Deno got it's branding from libuv anyways.
Pre Evaluation Weeks
Tags: opensource, react, webdev, ux
Published: 2020-07-03 06:55:21

Hey there,
Here is the summary of 2 weeks prior to the 1st evaluation period. I worked mainly on Major Navigational components along with optimizations and bug fixes.

# Tasks Completed:
✅ Add Navigation to User Responses.
✅ Optimize the UI for larger screens.
✅ fixed alarming colors in the UI.
✅ Add Typing effect to Gooey Message.
✅ Restructure JSON Path-Map.
✅ Add dynamic gooey messages fetched from the JSON path map.
✅ Centralize the React State Handling.

---------------------------------------------------------
# Links:
Pull Requests - 
- https://github.com/MovingBlocks/AdventureSite/pull/6
PR

- https://github.com/MovingBlocks/AdventureSite/pull/7

---------------------------------------------------------
> #### Post Type: Update.

Regards,
Prathamesh (TheShubham99)


### `$ Ctrl+z`

> ### `program exited with exit code 0 (0x0)`
Ionic Resources
Tags: ionic
Published: 2020-07-03 06:10:18

Another great thing that Ionic comes with out of the box is the ability to generate resources.
Meaning we can super easily create a splash screen and app icon.
We don't have to create every size possible for the billions of devices sizes we have nowadays.

> Make sure your project is prepared for Cordova, run the following command: `ionic cordova prepare`

## Ionic Preparing the Assets

Let's start by preparing the assets.

For the App icon, we can prepare an image that is at least `1024x1024px`. The source for the splash screen must be at least `2732x2732px`.

They must be places in the following folder:

- `Icon` - `resources/icon.png` - (min 1024x1024px)
- `Splash` - `resources/splash.png` - (min 2732x2732px)

For the best results, the splash screen's art should fit inside a square that's `1200x1200px` within the bigger one.

> Ionic has this [PSD splash](https://code.ionicframework.com/resources/splash.psd) template.

## Platform Specific Resources

We can also generate platform-specific images, for instance, if your Android icon is different from the IOS one.

For this we add a second layer of folder;

- `Icon` - `resources/{platform}/icon.png`
- `Splash` - `resources/{platform}/splash.png`

Where {platform} can we `ios` or `android`.

## Ionic Generate Resources

To create the actual resources, run the following command in the root of the project.

```bash
ionic cordova resources
```

This command will update your `config.xml` with the newly generated resources.

We can also generate only iOS resources:

```bash
ionic cordova resources ios
```

Or, just the android ones:

```bash
ionic cordova resources android
```

### Thank you for reading, and let's connect!

Thank you for reading my blog. Feel free to subscribe to my email newsletter and connect on [Facebook](https://www.facebook.com/DailyDevTipsBlog) or [Twitter](https://twitter.com/DailyDevTips1)
How to write React code without create-react-app 
Tags: javascript, react
Published: 2020-07-03 05:55:57

I want to play around with React for a little thing. For that first I thought to create a react app with create-react-app then I realize do I really need such a build tool! Then I discover something to play with react without any tool.

**please note don't use it in production**

- First create a html file called index.html
```html
<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>React without create-react-app</title>
</head>
<body>
  
</body>
</html>
```
- add root div as react needs to render
```html
<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Document</title>
</head>
<body>
  + <div id="root"></div>
</body>
</html>
```
- Then add 3 scripts tag to work with react
```js
<script src="https://unpkg.com/react@16/umd/react.development.js"></script>
<script src="https://unpkg.com/react-dom@16/umd/react-dom.development.js"></script>
<script src="https://unpkg.com/@babel/standalone/babel.min.js"></script>
```
- voila! write your react code within <script></script> tag make sure the script tag have type of text/babel
```js
<script type="text/babel">
function Welcome() {
  return <h1>Hello React World!</h1>;
}

ReactDOM.render(<Welcome/>, document.getElementById('root'));
</script>
```
- Final code will be like this 
```html
<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Document</title>
</head>
<body>
  <div id="root"></div>

<script src="https://unpkg.com/react@16/umd/react.development.js"></script>
<script src="https://unpkg.com/react-dom@16/umd/react-dom.development.js"></script>
<script src="https://unpkg.com/@babel/standalone/babel.min.js"></script>
<script type="text/babel">
 function Welcome() {
  return <h1>Hello React World!</h1>;
 }

 ReactDOM.render(<Welcome/>, document.getElementById('root'));
</script>
</body>
</html>
```
How do you create your code snippets?
Tags: webdev, discuss, productivity
Published: 2020-07-03 05:53:24

---
title: How do you create your code snippets?
published: true
description: 
tags: webdev, discuss, productivity
//cover_image: https://direct_url_to_image.jpg
---
Whether it's for educational purposes in a tutorial or just sharing an idea with a friend, often in our dev workflow it's important to know some beautiful code snippet creation tools.

From capturing directly from code editor I use [Polacode](https://marketplace.visualstudio.com/items?itemName=pnp.polacode).
If I need a specific design for the snippet, I usually use [Carbon.sh](https://carbon.now.sh/)

What are your weapons/methods of choice?
I am getting undefined object when I use req.query.search in express
Tags: help, javascript, node, discuss
Published: 2020-07-03 05:41:38

node js code:

```
var express = require("express");
const axios = require("axios");
var app = express();

app.set("view engine", "ejs");

app.get("/", function(req, res){
	res.render("search");
});

app.get("/results", async function(req, res){
	var Search = req.query.search;
	console.log(Search);
	var url = 'http://www.omdbapi.com/?s='+Search+'&apikey=thewdb';
	try{
		const response = await axios.get(url);
		res.render("results", {data:response.data});
	}
	catch(err){
		console.log(err);
	}
});

app.listen(3000, function(){
	console.log("sever listening to port 3000");
});
```
search.ejs code:
```
<h1>Search for a movie</h1>

<form action="/results" method="GET" name="search">
	<input type="text" placeholder="search term">
	<input type="submit">
</form>
```
results.ejs code:
```
<h1>Results!!</h1>

<% data["Search"].forEach(function(movie){ %>
	<li><%= movie["Title"] %></li>
<% }) %>  
```

I get undefined movie names:
![Alt Text](https://dev-to-uploads.s3.amazonaws.com/i/mh3qmiihrh9f2x3y3j0r.PNG)
Frequent Updates Hell
Tags: ios, android, macosx
Published: 2020-07-03 05:37:16

The following is in the context of installable apps on mobile devices and personal computers.

There are essentially two types of updates I have observed that vendors keep on providing us hungry users with:
1. Updates that enhance features in the app, or address critical issues, and come with a respectable description of the changes brought in.
2. Updates that make no sense at all other than "Bug Fixes and Performance Improvements". That's it, this is all that is mentioned. 

While it does make sense to provide feature enhancements and address issues, following are two queries I am looking for answers to:

1. **How often should version updates be released?** This applies especially when all that is being going to be mentioned is "Bug Fixes and Performance Improvements." In fact looking at so many updates with exactly the same statement also makes me wonder if the app developer(s) knew about these problems all along or were those bugs really new ones that the developers kept coming across.

2. Should developers indicate more than just **Bug fixes and Performance Improvements** in their updates? This "bugs" me a lot, especially also when I find no notable difference in the updated app as compared to the last one. Anyone else also feel the same?

My initial take on the above two points has to do not only with showing off one's tech prowess and addressing **real** issues, but also to consider overall user experience while providing any updates. While "bugs" must definitely be squashed and gotten rid of, should not the user be made more aware of what was fixed and how would it help enrich the user's experience?

Below are images of WhatsApp providing frequent updates with the same static description. I use WhatsApp way too much, and like it too, and am not trying to target this app, but this struck me as a perfect example to highlight the point I am trying to make.

![Alt Text](https://dev-to-uploads.s3.amazonaws.com/i/wviichow0tlziwit4w0i.png)![Alt Text](https://dev-to-uploads.s3.amazonaws.com/i/8heygz672o9quky4mkg3.png)

Apart from just being an annoyance, I really do not know if I should keep on upgrading these kind of apps and add to the SSD/Flash Drive Write Cycles. So, are SSD write cycles relevant these days?

Then again, are there any industry best practices which state the order and manner in which bug fixes should be rolled out, in case there are more number of bugs that can be handled per given time frame?
Tools that you should use as a programmers.
Tags: productivity
Published: 2020-07-03 05:31:16

As a programmers your productivity matter most and Here some tools can be useful for you. These tools will increase you productivity in you work and also in you daily life. Personally I use these tools in my daily life and these was becoming very useful for me and these can be useful for you.
Read Full - https://bit.ly/productivetools
Mistakes In App Development That Can Break Your App Success
Tags: apps, mobileapps
Published: 2020-07-03 05:19:40

The mobile app market is growing all over the world and many businesses are gaining profit through it. No one is perfect in this world, whether he will be an app developer or an app reseller. Developing and launching an app is not an easy task as it seems to you. App development with a lack of appropriate plan, tools, and team won’t end up with the app you wanted. Nobody intends to make a mistake while developing an app but 99% of mistakes have been made with the early stage of the development process. Before you start the development of a new project, you must know the following 11 mistakes that may break your mobile apps.

**Most Common Mistakes That Can Break Your App Success-**
*1. Insufficient Planning And Research-*
Each project needs a proper strategic business plan. Without appropriate plans, goals, and direction, even the great app ideas will not succeed. Hence before starting to work on a project, you must have a clear vision of the following points-

Targeted audience-

Researching the needs and challenges of your audience is important before you design and develop your app. It helps to get key insights that help you to build up your idea and direct you to a better path.

Challenge research-

Most of the business owners implemented an app idea but failed to grab the users. Before you start the development of an app, it is important to ensure that your solution will solve the problem of the targeted audience. 

Uniqueness of an app-

Before you start the app development, it is important to analyze the market competition and accordingly decide and prioritize the necessary actions to stand with the current growing market.

Objective of App-

A strong clear plan is the backbone of app ideas. It helps you to identify the areas you need to research, grab the opportunity.  Make sure that the goal and communication is clear to convey the app idea and concept with the team, so that they know exactly what and what you are trying to implement.

*2. Selecting Wrong Platform-*
After you have done with the proper market research, it is time to decide the proper platform for app development. Whether you are building an app for desktop, web or mobile, the selection of platforms depends on your target audience, and the type of problem you’re trying to solve. For eg., your users are fitness addicts, and looking for a health and wellness solution, then with a mobile fitness app, you will give your users the proper health inspiration. If your users are office managers and looking for a custom communication system that can be accessed with multiple platforms, then your custom app will help them to keep in touch a whole day.

In short, Whichever will be the case, knowing the platform that users will use is a key for you while searching for the best development platform. So just invest your precious time and money into the appropriate development platform.

*3. Building An App For Many Platforms-*
Know more at- [https://solaceinfotech.com/blog/mistakes-in-app-development-that-can-break-your-app-success/]
Can I Use 'Variables' in CSS ? Yes !! Let's see how
Tags: css, html, javascript, webdev
Published: 2020-07-03 05:10:41

I am into the web development field for a quite long time now, but I am today year old when discovered that we can use variables in our CSS3.

So let's get started.

Assume that you are applying font-family property to 4 or 5 elements and that's where variable comes into action.

The variable with its property is defined and declared in **:root** with **--** prefixed with the variable name.

```
:root {
    --varfont: 'Roboto', sans-serif;
}
```

And use it like this :

```
h1
{
  font-family: var(--varfont);
}
```

Hope it helped you !!!

Follow me for more such content :
Instagram : https://instagram.com/anujcodeop
Portfolio : https://anujportfolio.herokuapp.com
Using yarn with Angular CLI
Tags: angular, yarn, tutorial, cli
Published: 2020-07-03 05:03:28

---
title: 'Using yarn with Angular CLI'
published: true
description: In this tutorial you will learn how you can set a different package manager so that your project gets created with the correct lock file.
tags: angular, yarn, tutorial, cli
canonical_url: https://beeman.dev/posts/using-yarn-with-angular-cli-1n73
cover_image: https://dev-to-uploads.s3.amazonaws.com/i/l7926nvoj7mh61ohv9em.png
---

When running `ng new` the Angular CLI uses `npm` as the default package manager. In this tutorial you will learn how you can set a different package manager so that your project gets created with the correct lock file.

<small class=crayons-article__subheader>This tutorial should work for Angular version 6 and higher</small>

### Configure the package manager

To enable `yarn` for Angular CLI you have to run the following command:

```
ng config -g cli.packageManager yarn
```

Additionally, Angular CLI has support for [cnpm](https://npm.taobao.org/), a package manager that works behind the Chinese firewall. As expected, you can activate it with this command:

```
ng config -g cli.packageManager cnpm
```

If at any point you want to revert back to `npm` run this:

```
ng config -g cli.packageManager npm
```

### Global Angular CLI config file

Because we passed in the `-g` flag in our `ng config` command, the changes are stored in the global Angular CLI configuration. If for whatever reason you like to change the package manager for the current project only, you can simply leave out the `-g` flag.

The global configuration file is stored in `<YOUR_HOMEDIR>/.angular-config.json` and in the snippet below you can see how the settings are stored.

```
$ cat ~/.angular-config.json
{
  "version": 1,
  "cli": {
    "packageManager": "yarn"
  }
}
```

### Thanks!

Thanks for reading my article, I hope it was useful. Feel free to reach out and follow me on [Twitter](https://twitter.com/beeman_nl/) or leave a comment on DEV! 🐝
Least Frequently Used Cache Implementation
Published: 2020-07-03 05:01:47

---
title: Least Frequently Used Cache Implementation
published: true
description: 
tags: 
cover_image: 
---  

https://github.com/adavidoaiei/LeastFrequentlyUsedCache

## Overview 

The idea behind least frequently cache policy is that for each item from cache it keeps a use count which increments each time when the item is accessed, when cache exceed the limit this evicts(removes) the element with minimum use count freeing memory for a new element.

## Installation 

NuGet package manager:

```
Install-Package LfuCache -Version 1.0.0
```

## Example Using

```csharp
ICache<string, string> cache = new LfuCache<string, string>(1000);
cache.Add("name", "Helene");
cache.Add("surname", "Stuart");
var name = cache.Get("name");
```

## Implementation

The <b>LfuCache</b> implements interface <b>ICache</b>.<br>
<img src="https://res.cloudinary.com/dbvcampra/image/upload/v1582909400/diagram_xkbden.png" />

It's needed a data structure to store elements from cache sorted by use count, the current implementation uses a SortedList where key is use count and Value is LinkedList of elements from cache with the same use count, SortedList sorts LinkedLists by use count using a binary tree.
This data structure allows to run Add/Get operations in O(log n) time.

<img width="800px" height="400px" src="https://res.cloudinary.com/dbvcampra/image/upload/v1556623202/binary_tree_linked_list_r9zgzj.jpg" />

## Performance benchmark <br>

1000.000 add/get operations on implemented Least Frequently Used Cache of size 90.000 using elements from a list with 100.000 takes 466ms.

<img src="http://res.cloudinary.com/dbvcampra/image/upload/v1469634935/lfu_syqnac.png" />

This cache runs faster than MemoryCache from .NET Framework and consumes less memory than this on the same benchmark.

<img src="http://res.cloudinary.com/dbvcampra/image/upload/v1469634935/mc_ikzrsm.png" />

The Add/Get operations sequence is generated random in an operations array of size OperationsCount, this operations process elements from a list of size EelementsCount using selected cache.

Performance benchmarks have been run with the following library <a href="https://benchmarkdotnet.org/" target="_blank">PerformanceDotNet</a>.

<img src="https://res.cloudinary.com/dbvcampra/image/upload/v1556225816/benchmarks_gqqzru.png" />

## Unit Tests Code Coverage 

The unit tests are written using <strong>MSTest framework</strong> and the code coverage report is generated with Azure Pipeline.

<img src="https://res.cloudinary.com/dbvcampra/image/upload/v1556279286/code_coverage_lzv2si.png" />