teleren/devto huggingface dataset:
Need guidance with securing the REST API from DDoS 
Tags: security, api
Published: 2021-06-11 07:25:37

Hi community. I am planning to build my own product which would have the functionality exposed as a REST API for others to consume and I am looking to secure my API against DDoS. 

I am thinking of creating the REST API in PHP but I can go with Firebase also for Serverless Architecture, if the cost is not going to be exorbitant in the long run and the Firebase Functions are secured automatically against DDoS.

Can anybody give me some pointers? Thanks.
WooCommerce Wholesale Prices
Tags: woocommerce, wholesaleprices
Published: 2021-06-11 07:18:21

With the help of WooCommerce Wholesale Prices adding features like Add customer and user role specific pricing. Similarly, there’s also an option to add quantity-based pricing for the retailer, wholesale, and other B2B user roles. Apart from this, you can also Customize table color and font size. The categories or selected products that need to be hidden can also be possible through these extensions. This extension also helps you to set different quantity-based discounts for customers.
https://woocommerce.com/products/wholesale-tiered-pricing/
Shopware Development Services by Shopzy Squad
Tags: webdev, ecommerce
Published: 2021-06-11 07:05:29

<p><strong>Why we use Shopware 5 and 6 Development?</strong></p>
<p><em>Shopware expertise and deep eCommerce knowledge combined for best project results</em></p>
<p><a href="https://shopzysquad.com/shopware-store-development/">Shopzy Squad</a> is a certified Shopware development agency with extensive experience in developing robust and intelligent e-shop solutions. Shopware is an innovative ecommerce technology that lets you provide your customers with emotional shopping experience, elevate user engagement, and get full freedom of customization. We&rsquo;ll let you benefit from Shopware&rsquo;s advantages and build a reliable future-ready solution.</p>
<ul>
<ul>
<li>Freedom to grow</li>
<li>Flexibility</li>
<li>Smooth internationalization</li>
<li>Storytelling features</li>
<li>Shorter time-to-market</li>
<li>High performance</li>
</ul>
</ul>
<p><strong>What can we do?</strong></p>
<ul>
<li><strong>Shopware store development</strong></li>
</ul>
<p>Build, relaunch or extend your ecommerce website with our Shopware development services that include design, coding, testing, maintenance, hosting and more.</p>
<ul>
<li><strong>UX and UI design</strong></li>
</ul>
<p>Our team makes sure your website is well-structured, user-friendly, unique, and fully corresponding to your business needs and target audience.</p>
<ul>
<li><strong>Migration</strong></li>
</ul>
<p>We can help you find the right migration roadmap and move your e-store from any eCommerce platform, including Shopware 5, to a brand new Shopware 6 system.</p>
<ul>
<li><strong>Support and Maintenance</strong></li>
</ul>
<p>Ensure your website is regularly well-maintained, updated and optimized to achieve best performance and security.</p>
<ul>
<li><strong>Conversion Rate Optimization</strong></li>
</ul>
<p>Improve the ratio of website visitors converted into customers. Through research and analysis, we achieve lasting results and better ROI.</p>
<ul>
<li><strong>Plug-in development</strong></li>
</ul>
<p>Get additional functions for your e-shop to address specific business needs. We develop easy-to-manage and configurable Shopware plugins.</p>
<ul>
<li><strong>Template development</strong></li>
</ul>
<p>We create custom Shopware templates to perfectly match your corporate style and brand identity, and also achieve great website usability.</p>
<ul>
<li><strong>Search engine optimization</strong></li>
</ul>
<p>Our team makes sure your Shopware website follows all SEO standards and each page is fully optimized to achieve top search engine rankings.</p>
<p>&nbsp;</p>
<h2>Work with us!</h2>
<p><a href="https://shopzysquad.com/shopware-store-development/">Shopzy Squad</a> knows how difficult a project can be for you. Therefore, we want to support you in the early stages of your project. We have answered some popular questions regarding Shopware. You can familiarize yourself with them below.</p>
<p><strong>&nbsp;</strong></p>
JavaScript news weekly article for June 2021 2nd week
Tags: javascript, react, reactnative, angular
Published: 2021-06-11 06:43:23

This week highlight is: 
1. Integrate face, hand tracking to frontend
2. The Plan for React 18
3. History of Angular with Misko Hevery
4.JavaScript quiz to test your knowledge 

Check the link for more
https://thearrowfn.com/javascript-news-2nd-weekjun-integrate-face-hand-tracking-frontend-javascript-quiz-to-test-your-knowledge/
Game Engines vs Game Frameworks
Tags: gamedev, frameworks, engines, libraries
Published: 2021-06-11 06:16:18

When people talk about **Game Development**, most of them think about Unity, Unreal Engine, or another famous Game Engine.

As for new developers, **Game Engines** are really great, because they are higher level, they include basic pieces to make games (graphics renderers, audio engines, ...). They have Level editors and Scene Graph (data structure, in which game data is stored in). Also, they do most of the 'dirty work' for you and in some cases, you can make a game without writing a single line of code (CopperCube engine). But it's not always a good idea to use a Game Engine for making games. 

There are lots of games, that need their own logic, their own behavior, etc. And developers have 2 main choices. Either force tools to behave the way they need or create their own. (Actually, there is a 3rd option as well - quitting).

In cases, where they want to make something of their own, customized for themselves, **Game Frameworks** come in handy. Game Framework is a collection of libraries and tools. Libraries are usually created to solve a single task (such as physics, graphics, tweens, etc.).

Unlike Game Engines Game Frameworks make you code a lot. But it's a very good idea to use Game Framework if you want to practice coding.

And if you're experienced enough, you can bring together different tools and libraries (or create your own ones) and make something like Game Engine, from Game Framework.

Summing up, I will recommend Game Engine if it fits your need. Otherwise, I recommend Game Frameworks, because it will help you with coding practice and eventually will push you into creating something of your own (library, tool, or something like that).
Fre-2.1 has been pulished
Tags: reactnative, react, fre, preact
Published: 2021-06-11 06:10:36

I announce that fre2 is officially released, which is a major breakthrough version. 

### Offscreen rendering

The bigist breakthrough is offscreen rendering, a core algorithm refactor.

https://github.com/yisar/fre/releases/tag/2.1.0-alpha

before: 

![Alt Text](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/9901lyz1u8jf3fdxjnnu.png)

after:

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

Offscreen rendering is an algorithm level optimization, it traverses vdom in reverse order, from bottom to top, from right to left, to ensure that the front DOM pointer is in memory, and finally it is drawn to the screen at one time.

With off screen rendering, fre has become the best performance frameworks in vdom world, not one of.

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

Just as react 18 also released alpha version, fre 2.1 also tried to be compatible with them.

### CreateRoot

```js
import { render, useState } from 'fre'

function App() {
  const [count, setCount] = useState(0)
  return <>
      <h1>{count}</h1>
      <button onClick={() => setCount(count + 1)}>+</button>
    </>
}

createRoot(document.body).render(<App/>) // here
```

This API is more ergonomic, and for the callback, you can do this:

```js
function App({ callback }) {
  return (
    <div ref={callback}>
      <h1>Hello World</h1>
    </div>
  );
}

createRoot(document.body).render(<App callback={() => console.log("renderered")} />)
```
### startTransiton

This is an API for lowering priority, which is very useful, so I decide to build it in.

```js
function App() {
  const [count, setCount] = useState(0)

  console.log(count) // 1 2

  const update = () =>{
    startTransition(()=>{
      setCount(2)
    })
    setCount(1)
  }
  return <>
      <h1>{count}</h1>
      <button onClick={update}>+</button>
    </>
}
```
It works can be understood as `setTimeout (cb, 0)`, but the callback function is executed synchronously, and the update is delayed asynchronously.

### auto-updates

https://github.com/yisar/fre/blob/master/demo/src/auto-batch.tsx

Fre has always been supportive.

### Suspense SSR

This is the only breakthrough of react 18. I like it very much, but fre doesn't support it now. 

I need to spend some time to study it.

### Summary

Fre2 has also been released. If you are interested in the front-end framework, you can jump to GitHub.

https://github.com/yisar/fre

It has all the advanced features of react 18, but only 400 lines of code, and its performance is much better than react.
Creating a custom error page on Django
Tags: python, django, webdev, tutorial
Published: 2021-06-08 09:26:41

By default, when your Django app runs into an error Django returns a page that looks something like this:

![Default Django error page on debug](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/6ci08el2nmzancp0cr09.PNG)

This is Django's default error message when debugging is enabled in your application (i.e. it is in development). This tutorial will help you create a custom error page for your Django web application.

## Set `DEBUG` to `False`

Notice the message at the bottom part of the page:

> You're seeing this error because you have `DEBUG = True` in your Django settings file. Change that to `False`, and Django will display a standard 404 page.

To disable debugging, go to your projects's `settings.py` and set the value of the variable named `DEBUG` to `False`. Additionally, you might have to define allowed hosts for your application. This can be done by adding the hosts to the variable named `ALLOWED_HOSTS` (usually found just under `DEBUG`), like so:

```python
ALLOWED_HOSTS = ['localhost', '127.0.0.1']
```

Once you've done this, visiting a page that doesn't exist will now lead you to a page that looks something like this:

![Default Django error page without debug](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/fskfjzpymoadzfcl2lo2.PNG)

This is Django's default error page in production. But if you like to change how this looks like, then follow these steps.

## Add a handler for the error

There are a few [variables that will override the default error views of Django](https://docs.djangoproject.com/en/3.2/topics/http/views/#customizing-error-views), one of which is `handler404` which overrides the Page Not Found view. Add this to your `urls.py` file:

```python
handler404 = 'your_app_name.views.entry_not_found'
```

where `entry_not_found` is a function in `views.py` that will render a page containing your custom error message, like this:

```python
def entry_not_found(request, exception, template_name='404.html'):
    return render(request, template_name)
```

## Add the template

Now all you have left to do is populate `404.html` to contain your custom error message. Note that `404.html` should reside in your root `templates` folder.

---

If you found this useful, consider [buying me a coffee](https://ko-fi.com/yanski_).
Date filter for HTML Table
Tags: javascript, html, css
Published: 2021-06-11 05:48:28

Following HTML table has Start Date and End Date in different columns and if we need to filter the rows between these dates with the help of a date picker.

```
<table class="table table-striped mt32 customers-list" id="tableData">
	<thead>
		<tr>
			<th width=40%> Name</th>
			<th>Internal Name</th>
			<th>Offer Code</th>
			<th width=30%>Start Date</th>
			<th width=30%>End Date</th>
		</tr>
	</thead>
	<tbody>
		<tr id="maintr">
			<td> Amazon Spring ADP 2020 -$5 Amazon GC </td>
			<td> PRDOFR168_livePERD </td>
			<td> SPRINGADPAMZ5GC2020 </td>
			<td> 22-JAN-20 </td>
			<td> 30-APR-20 </td>
		</tr>
		<tr id="maintr">
			<td> Indy Car Giveaway 2020 </td>
			<td> PRDOFR170 </td>
			<td> INDYCARSWEEP2020 </td>
			<td> 22-JAN-20 </td>
			<td> 15-APR-20 </td>
		</tr>
		<tr id="maintr">
			<td> Indy Car Giveaway 2020 </td>
			<td> PRDOFR170_livePERD </td>
			<td> INDYCARSWEEP2020 </td>
			<td> 22-JAN-20 </td>
			<td> 15-APR-20 </td>
		</tr>
		<tr id="maintr">
			<td> Test Offer 2 </td>
			<td> DEVOFR190 </td>
			<td> </td>
			<td> 29-JAN-20 </td>
			<td> </td>
		</tr>
		<tr id="maintr">
			<td> Test Offer 3 </td>
			<td> DEVOFR193 </td>
			<td> </td>
			<td> 29-JAN-20 </td>
			<td> </td>
		</tr>
	</tbody>
</table>
```


Script to filter date on 3 and 4 column

```javascript
 <script>
const searchbyDate = () => {
	var startDateArr = [];
	var endDateArr = [];
	var myTab = document.getElementById('tableData');
	let InputStartDate = document.getElementById('date_input').value;
	let InputEndDate = document.getElementById('date_input2').value;
	// LOOP THROUGH EACH ROW OF THE TABLE AFTER HEADER.
	for(i = 1; i < myTab.rows.length; i++) {
		// GET THE CELLS COLLECTION OF THE CURRENT ROW.
		var objCells = myTab.rows.item(i).cells;
		var t1 = new Date(objCells.item(3).innerHTML)
		startDateArr.push(t1);
		var t2 = new Date(objCells.item(4).innerHTML)
		endDateArr.push(t2);
	}
	var startDate = new Date(InputStartDate);
	var endDate = new Date(InputEndDate);
	startDate.setHours(0, 0, 0, 0);
	endDate.setHours(0, 0, 0, 0);
	let myTable = document.getElementById('tableData');
	let tr = myTable.getElementsByTagName('tr');
	if(+startDate > +endDate) {
		alert("Select Valid Date. Now please Refresh this page to continue to run code.");
	} else {
		for(var j = 0; j < endDateArr.length; j++) {
			var temp1 = new Date(startDateArr[j]);
			var temp2 = new Date(endDateArr[j]);
			if(startDate && !InputEndDate) {
				if(+startDate <= +temp1 || +startDate === +temp1) {
					tr[j + 1].style.display = "";
				} else {
					tr[j + 1].style.display = "none";
				}
			} else if(!InputStartDate && endDate) {
				if(+endDate >= +temp2 || +endDate === +temp2) {
					tr[j + 1].style.display = "";
				} else {
					tr[j + 1].style.display = "none";
				}
			} else if(startDate && endDate) {
				if((+startDate <= +temp1 || +startDate === +temp1) && (+endDate >= +temp2 || +endDate === +temp2)) {
					tr[j + 1].style.display = "";
				} else {
					tr[j + 1].style.display = "none";
				}
			}
		}
	}
}
```
UpSuite | Cloud Based ERP Software for Small Business and Enterprise

Published: 2021-06-11 05:30:19

UpSuite ERP is developed by Allianze Infosoft – an acclaimed software development company, to help enterprises belonging to diverse industries manage their routine business operations for better performance, 
compliance, and more. It has various modules designed for different enterprise needs ranging from HRMS, Manufacturing, Sales, CRM, Fleet Management, Legal/Law. 
UpSuite ERP is highly capable of providing accurate information and meaningful insights for streamlining processes, improve collaboration, make data-driven decisions, 
and advancing business competence in a disruptive manner - all from a single, efficient, and powerful system.

Email Us : support@upsuiterp.com

Website : https://www.upsuiterp.com/
useDialog - Vue.js snippets
Tags: vue, composition, api, javascript
Published: 2021-06-11 05:27:47

> THIS IS NOW OUTDATED

> Please see the [Type Safe, Promise Based, Vue 3 Modals That'll Have You Popping with Joy](https://dev.to/neophen/type-safe-promise-based-vue-3-modals-thatll-have-you-popping-with-joy-4299) post on how to create, much nicer, typesafe and simpler modals in Vue 3


## TL;DR;
Here's the [link to the gist](https://gist.github.com/Neophen/877f8662cfe46f39cfb6f6393a6fff4a) use/change/modify it.

Have you ever wanted a simple dialog, which is completely custom, but you didn't want to pull in a package.

But it always looks like a mess to make?

Well worry no more! In todays Vue.js snippets post we'll make just that! Don't believe me? Have a look at the finished result!

{% youtube FdG0zBa6Sj4 %}

And this is the API for it:
![the api of using dialogs](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/q2stxmb88k5ot9j63840.png)

If you like it here's the explanation on how to write one yourself.

## The `useDialog.js`

The basic premise is, we want a nice api to use dialogs right?

Something that has an expresive api with autocompletion if possible. Something like:

```js
Dialog.myCustomType()
.title('hello')
.onConfirm(() => { //do something })
```

This is a bit of a whopper of a class, but it's easy to write test for. I've written the basic api. You can change/modify this to your liking.

## Thing to improve?

- Allow multiple onConfirm/onCancel callbacks
Quite simple just change the `onConfirmCallback` to `onConfirmCallbacks = []`
And then on each call of `onConfirm`, just push the callback into the stack, and `onResolve` await all of the callbacks
Cracking the java interview
Tags: java, interview, beginners, springboot
Published: 2021-06-11 05:22:52

Hey there!

 I sometimes do technical interview for java. So I thought I would publish some of the questions I shoot, and the qualities I look for in an answer. 

## Easy interview

If my ask is to go easy on the interviewee for a not much demanding role below are the few questions I ask.

What I look for in the answer is the clarity of thought and if they really understand the topic. I also look for a good attitude and keenness for learning.

#### OOPS concept
1. What is inheritance and write a sample code
2. Why multiple inheritance is not possible in java
3. What is polymorphism and write a sample code (both overloading & overriding)

#### Core java
1. How a String is stored, immutability, intern etc
2. Autoboxing & unboxing
3. What is serialization

#### Collections
1. Create a list with some duplicates. Then remove the duplicates
2. In what scenarios they would use arraylist & linkedlist implementation
3. Give a scenario to write a stream 

#### Basic SQL 
1. I will ask them to write a basic sql query where they have to join two tables and maybe get a max value of a column

#### General Questions
1. If you encounter a problem with a web application (ex system unavailable error) how do you go about debugging. 
2. Tell me anything that challenged you technically and how you overcame it

## Difficult interview

If I am asked to interview for a more challenging role This is how I go about it

Here I look for is their strength in each topic and how they approach to each problem even if they don't know the exact answer. 

#### FizzBuzz
1. Write a program to print n number in Fibonacci series  (If they implement DP , I would be really impressed)

#### Programming questions
1. Write a program to print sqrt of a number without using Math package (This is a question I recently asked but I would change whenever I come across some interesting problems)

#### System Design questions
1. I will give a scenario with a bottleneck and ask them to go about the solution. For eg. design a asynchronous system in java 

#### Performance related questions
1. How do they find place where a system is slow and how do they go about resolving it.
2. If they have knowledge on database, I ask how they go about sql tuning or what they consider while writing a new query

Along with this I ask them some core java questions on threads, equals & hash methods overriding, springboot etc

How do you feel about these questions. Let me know some of the interesting questions you have (been) asked.

**Happy Friday!**
Interesting Python Tools and Libraries
Tags: python
Published: 2021-06-11 04:53:28


**ElectricEye**
Continuously monitor your AWS services for configurations that can lead to degradation of confidentiality, integrity or availability.

**Gramformer**
A framework for detecting, highlighting and correcting grammatical errors on natural language text.

**WholeFoodsFrugality**
A Tool to Find Sales at Grocery Chains.

**PyTCP**
PyTCP is an attempt to create a fully functional TCP/IP stack in Python. It supports TCP stream based transport with reliable packet delivery based on sliding window mechanism and basic congestion control. It also supports IPv6/ICMPv6 protocols with SLAAC address configuration.

**Graph4NLP**
Graph4nlp is the library for the easy use of Graph Neural Networks for NLP.

**Openspeech**
Open-Source Toolkit for End-to-End Speech Recognition leveraging PyTorch-Lightning and Hydra.

**HyperLib**
Library that contains implementations of machine learning components in the hyperbolic space.
LeetCode 55. Jump Game
(javascript solution)
Tags: algorithms, javascript
Published: 2021-06-11 04:26:54

###Description:
Given an array of non-negative integers nums, you are initially positioned at the first index of the array.

Each element in the array represents your maximum jump length at that position.

Determine if you are able to reach the last index.

###Solution:
Time Complexity : O(n)
Space Complexity: O(1)

```javascript
var canJump = function(nums) {
    // Keep track of max distance traveled so far
    let max = 0;
    for(let i=0;i<nums.length;i++){
        // The only time that max < i is when we are at 0 and we cannot move forward
        if(i>max) return false;
        // Move the max pointer the maximum 
        max = Math.max(nums[i]+i,max);
    }
    // If we did not get stuck at a 0 then return true
    return true;
};
```
JavaScript Slider Step By Step | JavaScript Project
Tags: javascript, webdev, beginners, resume
Published: 2021-06-11 04:25:13

## How to create **Responsive Testimonial Slider** With HTML CSS & JavaScript.

Hi there 👋,

Have a look at my responsive testimonial slider.

In this **testimonial slider** i have added two button for change the slider, we have added customer image, customer name & text. Also have made this complete page responsive using media query.

For this project I have used these libraries,
▶️ HTML
▶️ CSS
▶️ JavaScript

Here is the tutorial for this testimonial slider!
{% youtube 5cO5Xf4QVPY %}

You can use this to learn or for your portfolio.

**Feel free to visit my YouTube channel:
[@Tech2etc](www.youtube.com/tech2etc)**

**Follow me on Instagram where I'm sharing lots of useful resources!
[@fahimulkabir.chowdhury](https://www.instagram.com/fahimulkabir.chowdhury/) 😉**