teleren/devto huggingface dataset:
How to Validate a Textbox in the Blazor In-Place Editor component
Tags: blazor, webdev, dotnet, csharp
Published: 2022-04-05 06:20:09

A quick overview on how to validate a textbox in the Syncfusion [Blazor In-Place Editor](https://www.syncfusion.com/blazor-components/blazor-in-place-editor) using the EditForm component. In this video, you will learn how to display an error message when the text box input value is empty. You will also learn how to restrict the length of the input value and show a custom error message in the In-Place Editor component. 

_**Product Overview**_: https://www.syncfusion.com/blazor-components/blazor-in-place-editor

_**Explore our tutorial videos**_: https://www.syncfusion.com/tutorial-videos

_**Download this example from GitHub**_: https://github.com/SyncfusionExamples/how-to-validate-a-textbox-in-blazor-in-place-editor-component

_**Documentation**_: https://blazor.syncfusion.com/documentation/in-place-editor/validation

{% youtube Pg3hrFZVdyM %}
Why are the marker positions not behaving correctly on map?
Tags: javascript, react
Published: 2022-04-05 06:11:58

I have the below JS code

Why are only two markers displaying when clicking on the map, although the expectation is multiple markers should be displayed?

![map](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/h8f0t31ougnpecffozj9.png)

The marker is inside the tags too `<Marker key={i} position={latLng}` so it should work properly... It seems that `{props.isMarkerShown && <Marker position={props.markerPosition} />}` is not creating a new instance for the marker after the 2nd marker is created for some reason...

```
import React from 'react';
import { compose, withStateHandlers } from "recompose";
import { InfoWindow, withGoogleMap, withScriptjs, GoogleMap, Marker } from 'react-google-maps';

const Map = compose(
    withStateHandlers(() => ({
        isMarkerShown: false,
        markerPosition: null
      }), {
        onMapClick: ({ isMarkerShown }) => (e) => ({
            markerPosition: e.latLng,
            isMarkerShown:true
        })
      }),
    withScriptjs,
    withGoogleMap
)
    (props =>
        <GoogleMap
            defaultZoom={8}
            defaultCenter={{ lat: -34.397, lng: 150.644 }}
            onClick={props.onMapClick}
        >
            {props.isMarkerShown && <Marker position={props.markerPosition} />}

        </GoogleMap>
    )

export default class MapContainer extends React.Component {
    constructor(props) {
        super(props)
    }

    render() {
        return (
            <div style={{ height: '100%' }}>
                <Map
                    googleMapURL="https://maps.googleapis.com/maps/api/js?key=AIzaSyCZ_nTRNVYtgm1qoelJ1nJ817OrNyG1JlA"
                    loadingElement={<div style={{ height: `100%` }} />}
                    containerElement={<div style={{ height: `400px` }} />}
                    mapElement={<div style={{ height: `100%` }} />}
                />
                {clicks.map((latLng, i) => (
                    <Marker key={i} position={latLng} />
                ))}
            </div>
        )
    }
}
```
https://developers.google.com/maps/documentation/javascript/react-map
Rails Quick-Ref VOL. 1
Published: 2022-04-05 06:05:18

## What is rails?

Ruby on rails is technically a full-stack framework built on top of ruby. Meaning that it has the tools to build both front and backend apps.

## Why use rails?

Rails is best suited for quickly creating an API with custom logic within a MVC development structure. The generators allow you to quickly setup all files from the command line and connects them via [Active Record](https://guides.rubyonrails.org/active_record_basics.html)

## Getting into it:
 
1. add rails to your gem bundle, with `gem install rails`
2. use `rails new my-app` or bootstrap from chosen directory
3. run your rails server with rails server
4. _build your app_
From here you can everything from a full stack app to a simple API and everything in-between.

## Helpful Commands

- `rails s`
_start the server of current directory_

- `rails db:seed`
_populate the database from seed file_

- `rails db:migrate`
_update the schema file from the migration files_

- `rails new project-name options`
ex: `rails new Hacker-API`
_create a new rails directory_

- `rails d <name of generator> <class_name>`
ex: `rails d resource Shop`
_delete a specified generator_

- `Rails g` -lists the generators

- `rails g <generator> <model name> <attribute> <options> <flag>`

### Generators

- migration: creates a migration
- model: creates a migration and model
- controller: creates a migration, model, and controller
- resource: creates migration, model, controller, and routes
_These generators can be found in your config folder_ 

### attribute
Here we define an attribute of our model:
`attrname:string`
`name:DATATYPE`
with the attribute name and its data type.


### Options 
- `--no-test-framework` _exclude the test file_

helpful links: 



[What's new with Ruby on Rails 7](https://www.solutelabs.com/blog/ruby-on-rails-7)
[sauce](https://stackoverflow.com/questions/10605967/creating-an-initializer)
[more sauce](https://dev.to/vinistock/understanding-and-writing-rails-generators-10h1)
[Ruby on rails Wikepedia](https://en.wikipedia.org/wiki/Ruby_on_Rails)
Filter QuerySet with Array fields/values in Django
Tags: django, array, database
Published: 2022-04-05 06:02:02

Filtering `queryset` when working with Django is one of the most important and fun tasks to be done. 
If you are familiar with working with array/list values, you might want to know how to optimize your queries when working with array fields or values. 🚀

Well, let's learn some filters methods or array fields or values. 

## The `in()` method for array values

Suppose that you have a list of ids. You want to filter a `queryset` to only have the entries with ids that match ids values in the list.

```python
ids = [1,4,8,9]

Products.objects.filter(id__in=ids)
```

This is the equivalent in SQL:
```SQL
SELECT * FROM products WHERE id IN (1,4,8,9);
```

## The `ArrayField`

The `ArrayField` is a field used to store a list of data. We'll dive deeper into this field in another article. But here's a basic example of a model using this field.

```python
from django.contrib.postgres.fields import ArrayField
from django.db import models

class Product(models.Model):
    name = models.CharField(max_length=255)
    tags = ArrayField(models.CharField(max_length=255), size=10)
```
Great! Let's say you want to retrieve from the database all products with the `shoe` tag, or even more interesting with the `shoe` and `pants` tags.

For this, you use the `contains` filter. 

```python
# Retrieving all products with shoe tag

Product.objects.filter(tags__contains=['shoe'])

# Retrieving all products with shoe and pant tags

Product.objects.filter(tags__contains=['shoe', 'pant'])
```
And that's it basically.👀

You can also find interesting filters such as `contained_by` which is the inverse of [`contains`](https://docs.djangoproject.com/fr/4.0/ref/contrib/postgres/fields/#contained-by) but also the [`overlap`](https://docs.djangoproject.com/fr/4.0/ref/contrib/postgres/fields/#overlap) filter that checks that the retrieved entries contain at least a value with those passed. 



*Article posted using [bloggu.io](https://bloggu.io). Try it for free.*
SQL-Quick tip #7 - Find stored procedures
Tags: tsql, sqlserver, sql, mssql
Published: 2022-04-05 05:14:31

## Sql Server tips and tricks

This is part of a series of quick tips and tricks I have accumulated over the year, that I think can be useful for others.
If you have similar short tips and tricks please leave a comment.

### Find stored procedure

When working on large databases there can in some project be hundreds or even thousands of stored procedures, so if your task is to find all stored procedures that query a specific table then finding it could be quite a headache.
This query below has helped me many times and I hope it will help you too.

```sql
DECLARE @searchText VARCAHR(200) = 'customer'

SELECT name AS [Stored procedure name]
  FROM sys.procedures
 WHERE OBJECT_DEFINITION(OBJECT_ID) LIKE '%'+ @searchText +'%'
   AND [type]='P'
 ORDER BY name
```

![Sql Server Management Studio screenshot](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/4m2t7fidytgwnnmauzj9.png)
Bitcoin Unleashed - Understanding Bitcoin DeFi Resources
Published: 2022-04-05 05:03:49

## Catamaran Swaps
[Website](https://www.catamaranswaps.org/)
[Article on Catamaran Swaps and Bitcoin DeFi](https://www.hiro.so/blog/bitcoin-defi-is-here-a-deep-dive-into-trust-less-swaps)
[Catamaran Swaps Code on GitHub](https://github.com/friedger/clarity-catamaranswaps)
[Deployed Catmaran Swaps Clarity Contract](https://explorer.stacks.co/txid/SP2PABAF9FTAJYNFZH93XENAJ8FVY99RRM50D2JG9.btc-stx-swap-v1?chain=mainnet)

## Zest Protocol
[Zest Protocol Website](https://www.zestprotocol.com/)
[Open Wishlist Grant](https://github.com/stacksgov/Stacks-Grants/issues/234)

## Learn Stacks Development
[Starting Stacks](https://start.stacks.org/)
Pre-render page using getServerSideProps after user login
Tags: react, prerendering, getserversideprops
Published: 2022-04-05 04:26:25

Hi,
I'm new in NextJS, and I'm developing app where i want pre-render home page after login. Here in home page my API call need user token which is stored at local storage. So i'm not getting how to pre-render home page using getServerSideProps.
Can you please explain?
Thank you.
Scoping Jest tests
Tags: testing
Published: 2022-04-05 04:02:38

So far, we only looked at tests executing on the highest level. All tests are basically in the same scope.

But Jest gives us the option to scope down. This can be super easy for recurring tests setup.

For instance, in the previous article, we learned about [Jest recurring actions](https://daily-dev-tips.com/posts/jest-and-recurring-actions/), which are prime examples of use for scoping.

## How to define scope in Jest

To define a scope in Jest, we can use the `describe` function to wrap all our tests.

```js
describe('user related actions', () => {
  test('Create new user', () => {
    expect(createUser('Chris', 'p4sSw0rD')).toBe(true);
  });

  test('Update user', () => {
    expect(updateUser(1, 'Chris new name')).toBe(true);
  });
});
```

Now, these two tests will run inside this scope, and besides it being nice to organize, we get some added benefits of this scope.

For instance, this scope can get its own recurring actions. These defined actions will only fire for this scope.
However, global scope-defined actions will also fire!

For instance, let's say we have a public database, but for one section, we want to apply a hobby database as well.

```js
beforeAll(() => {
  return createDatabase();
});

beforeEach(() => {
  return populateUsers();
});

afterEach(() => {
  return clearUsers();
});

afterAll(() => {
  return removeDatabase();
});

test('Add a new user', () => {
  expect(addUser('Chris')).toBe(true);
});

describe('hobby related tasks', () => {
  beforeEach(() => {
    return populateHobbies();
  });

  beforeEach(() => {
    return clearHobbies();
  });

  test('Add a new hobby', () => {
    expect(addHobby(1, 'Photography')).toBe(true);
  });
});
```

Let's run this code and see what gets called to see what happens.

- before all
- before each (global scope)
- user test
- after each (global scope)
- before each (global scope)
- before each (hobby scope)
- hobby test
- after each (hobby scope)
- after each (global scope)
- after all

As you can see, a complete riddle of executions, but it's essential to look at the `before each` and `after each` fire order.

The scope can also be used to define and overwrite variables that you might use.

For instance, we might have a different logged-in user for whom we want to write test cases.

```js
describe('user related tasks', () => {
  const loggedUser = 1;
  test('Add a new user', () => {
    console.log(`adding new user: ${loggedUser}`);
  });
});

describe('hobby related tasks', () => {
  const loggedUser = 2;
  test('Add a new hobby', () => {
    console.log(`adding new hobby for: ${loggedUser}`);
  });
});
```

As you can see, we define the `loggedUser` twice, and the output of this sequence would nearly be as expected:

- adding new user: 1
- adding new hobby for: 2

I hope this gives you an excellent first introduction to defining scoped test blocks.

### 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)
Introducing StarfishQL - visualizing the dependency network on crates.io
Tags: rust, githunt, opensource, showdev
Published: 2022-04-05 04:26:03

[Introducing StarfishQL (sea-ql.org)](https://www.sea-ql.org/SeaORM/blog/2022-04-04-introducing-starfish-ql/)

We are pleased to introduce [StarfishQL](https://github.com/SeaQL/starfish-ql) to the Rust community today. StarfishQL is a graph database and query engine to enable graph analysis and visualization on the web. It is an experimental project, with its primary purpose (for now) to explore the dependency network of Rust crates published on crates.io.


![Top-N most-depended crates and their dependency network](https://www.sea-ql.org/StarfishQL/img/graph.png)
<p><figcaption align="center">Top-N most-depended crates and their dependency network</figcaption></p>

As the new member of the SeaQL family, it's a stellar example of what could be done with Rust and the [SeaORM](https://github.com/SeaQL/sea-orm) / [SeaQuery](https://github.com/SeaQL/sea-query) / [SeaSchema](https://github.com/SeaQL/sea-schema) suite of tools. We couldn't be more excited to see applications being built on Rust and the SeaQL ecosystem!

## Calling for GSoC Contributors!

We are pleased to be selected as a [Google Summer of Code 2022](https://summerofcode.withgoogle.com/programs/2022/organizations/seaql) mentor organization. All of our projects, including StarfishQL are on the [GSoC project ideas list](https://github.com/SeaQL/summer-of-code/blob/main/2022/README.md#2-a-graph-database-and-query-engine-codename-starfishql-for-graph-analysis-and-visualization) that opens for development proposals. Join us on GSoC 2022 by following the instructions on [GSoC Contributing Guide](https://github.com/SeaQL/summer-of-code/blob/main/2022/CONTRIBUTING.md).

p.s. the application period opens now!
2022 – ES6 Interview Questions and Answers
Tags: javascript, webdev, programming, tutorial
Published: 2022-04-05 04:23:25

**JavaScript interview questions and answers** for **beginners and professionals** provides a list of top mostly asked JavaScript interview questions.

Full Article on [Bhylu.com](https://bhylu.com/interview-questions/javascript-interview-questions/es6-interview-questions-and-answers-javascript/)

Questions are

1. Can you give an example for destructuring an object or an array?
2. List out important features of es6?
- Template Strings
- Spread Operator 
  - Copying an array
  - Concatenating arrays
  - Spreading elements together with an individual element
  - Spreading elements on function calls
  - Spread syntax for object literals
- Sets
  - Sets: Keys and Values
- repeat()
- Default Parameters
- Arrow function with this
- Destructing Assignment
- Generators
  - Implementing Iterables
  - Infinite Data Streams
- Symbols()
  - Global Symbols
- Iterator
3. ES6 Template Literals offer a lot of flexibility in generating strings, can you give an example?
4. What is the benefit of using the arrow syntax for a method in a constructor?
5. What are fat arrow functions? When you should not use arrow functions in ES6?
6. How does await and async works in es6?
7. What are the benefits of using arrow function over es5 function?
8. What are the differences between ES6 class and ES5 function constructors?
9. What are the benefits of using spread syntax and how is it different from rest syntax?
10. What are the differences between variables created using let, var or const?
11. What is the difference between for..in and for..of?
12. What is the Temporal Dead Zone in ES6?
13. What is the difference between ES6 Map and WeakMap?
14. How do you swap variables using Destructuring Assignment?
15. What is the output of below spread operator array?
16. What are default values in destructing assignment?

#Visit [Bhylu.com](https://bhylu.com/interview-questions/javascript-interview-questions/es6-interview-questions-and-answers-javascript/) for the article.
Manage your GitHub Starred Repositories
Tags: javascript, opensource, github, productivity
Published: 2022-04-05 04:22:26

Hello folks, this is a quick article about how you can manage your **GitHub's starred repositories**. 

You must have come across hundreds of awesome GitHub repositories but the problem is it's very hard to find the one you want at that moment in time.

For this, we usually **star** our GitHub repositories, but we forget about them.

To solve this, I came across this feature in GitHub (still in beta), where you can **create lists** to **organize** your starred repositories.

To do this you just click on the **arrow icon** next to **Star**
![Star](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/asic2yg6xgkopfxjicew.png)
  
You will be presented with a dropdown to **select** an existing list or **create** a new list
![List](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/jtpj59q371kdb0ygq22w.png)
 
Once you select a list, it will be saved in that list.
You can revisit it by going to **Your Stars**
![YourStars](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/sa7bupeen3cqy3uaikzm.png)

And you can see all your lists, you can go through them, search in them, etc.
![StarList](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/rwetnpntw5tszya1dx9u.png)

That's it for this article. Hope you found it useful. Share your thoughts down below.

Till next time, peace.
First Collab Project, Need Help With Github Workflow!
Published: 2022-04-05 04:08:12

Hey DEV.TO community! First off, as a newcomer, I'd like to say that this community has been absolutely exceptional thus far! 

I was hoping to get some help today with my Git/Github workflow. I am collaborating on a React JS project with another developer. This is the first time either one of us have ever collaborated on a project, so we are a bit stuck on the workflow.

So far we understand that we pull from the Master branch and each create a new branch for the features we will be working on. We understand that once those features are complete, we merge them into the Master. However.. We are unsure how we can go about merging our branches together in a 'Staging/Dev branch' to determine if they are working correctly with one another, before pushing to the Master.

Is that the right way to do it? Merge them both into a new branch before pushing to Master?

I'd also like to know, if we do merge our branches together in some sort of staging branch (_if that is the best workflow_), would we then merge that staging branch into our original feature branches that we are currently working on to continue developing with each others code present in our branches?

**TL/DR;** How do you test two separate branches together to ensure the code is working before merging the branches to Master?

I hope I was able to make my question clear, thanks DEV.TO!
Why Software Development?
Published: 2022-04-05 01:37:33

So this question keeps coming up...Why software development?  That’s a really good question and one I don’t have a ready answer for but maybe I can give some reasons as to why I want to work in software development. One thing I’ve been told that I’m not smart enough.  I’m not dumb.  I may be pretty but I’m not dumb.  You think I’m not smart enough?  Okay…Challenge accepted.  Am I up to that challenge?  That’s what I’m at Flatiron School to find out and to prove that I can.

A little about my background.  My first computer was a TI-99.  That was my first experience in programming.  Type a few lines in and something happens on the screen.  I was fascinated by that.  The next computer I had was a Commadore 64 and a little more programming learned.  I was getting hooked at a young age but then life happened and new experiences took over.  School became my main focus.  Keep in mind that this was the early 80s and no one knew that computers were going to become such a huge thing. 

My first reason for pursuing a job as a software developer is that I’m 50 years old and I work for Amazon.  It’s hard physical work and there’s not a lot of room for development, growth or recognition.  I don’t mind working hard but it’s not something I want to do until I get to retire.  In my previous positions I’ve been mentally challenged and stimulated and encouraged to use my brain and computers.  That just doesn’t happen at Amazon without a higher education.  To be honest, I miss the mental challenges that my other positions came with.

My second reason is that I want the flexibility to work either on my own or with a team.  I like the aspect of being able to work anywhere.  My parents are growing older and I need to be able to work from home occasionally so that I can help them.  They’ve been there for me a lot and now it’s my turn to be there for them.  I know that it might not happen, working from home, but it’s still very appealing.

Reason three is that the money and hours are better.  Having financial stability is incredibly appealing.  I’d like to own a home again some day and will need to be able to do better than live paycheck to paycheck.  Not only is there financial stability but there seems to be a lot of job stability since the field of software design just keeps growing.  If COVID taught me one thing it’s to be grateful to work in an industry that didn’t get shutdown.  That said there is a drawback to being considered “essential” at Amazon.  That drawback is that you work a lot of long, hard hours with little time off.  Having a predictable schedule is appealing as well.

I’ve worked in a lot of different fields and have had the joy of breaking programs.  Now I want the challenge of creating and fixing them.  I guess for me the main reasons for becoming a Software Developer boil down to the mental challenge, money, and  job stability.  So now I know why I want to be a Software Developer.  That just leaves the question of, “Am I up for the challenge?”  I know so.
Beginner Python Game: Journey to Restura
Tags: beginners, python, github
Published: 2022-04-05 04:01:26

As a very new programmer, I wanted to attempt a project that would help me familiarize myself with Python. 


![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/p0b2z6w0wrqy5w8lgfx7.png)

The majority of my code is text contained in if/else statements where the players can input choices that affect what happens.

[Link to Github](https://github.com/HaseebGarfinkel/TextAdventureGame
)

Thanks for taking an interest in my first project!
If you have any tips or advice for me, please leave me a comment.