www.devcurry.com Open in urlscan Pro
2a00:1450:4001:830::2013  Public Scan

Form analysis
0 forms found in the DOM

Text Content

ROUTING IN REACT.JS SINGLE PAGE APPLICATION USING REACT-ROUTER-DOM



The compositional pattern of the React.js library makes Single Page Application
(SPA) development easier. The most important need of SPA is an implementation of
Routing in the app. Since React.js does not have any built-in routing support,
we can install the react-router-dom library which provides a set of objects to
enable router functionality for React applications. 

The react-router-dom provides some of the following important classes:

1. Router - the common low level interface for all router components. This
contains the route expression to the components using the following properties: 
- path -  this property contains the URL used for navigating to a component. 
- component - name of the component to navigate to. 
- exact - when the property value is true, this will navigate only when the path
exactly matches the location.pathname . 


Continue Reading >>
Posted by Mahesh Sabnis No comments:
Email ThisBlogThis!Share to TwitterShare to FacebookShare to Pinterest




FLUENT VALIDATIONS IN ASP.NET CORE



In this article we will implement  Fluent Validations using ASP.NET Core.


Most of you might have used Data Annotations for server-side model validations.
We use data annotations to apply validations on public properties of the
entity/model class so that when the view is submitted, these model validations
are executed. 


Although Data Annotations are good, we have some limitations, e.g. the Data
Annotations are bound to the properties so performing conditional validations is
difficult. 


To implement conditional validations, we need to write logic in controller and
execute it. This is where we need to think of an alternative to the Data
Annotations. Fluent Validation is a cool solution we have for performing
validations on model classes. 


Fluent Validation is a .NET library for building strongly-typed validation
rules. It has support from .NET Framework v4.6.1+ and .NET Core v2.0 onwards. 

Continue Reading >>
Posted by Mahesh Sabnis No comments:
Email ThisBlogThis!Share to TwitterShare to FacebookShare to Pinterest




TESTING ANGULAR COMPONENT USING JEST



In this tutorial, we will go through the steps for testing Angular Component by
using the Jest framework.

Since Angular is a widely used front-end application development framework, it
is the responsibility of each developer to make sure that the components are
implemented as per the requirements of the project.  

Unit Testing is one of the recommended approaches of guaranteeing the quality of
the application. 




WHAT IS UNIT TESTING?

Unit testing is an approach of software testing where individual units of the
code are tested against the test data. The purpose of unit testing is to
validate that each unit of the software performs operations as per expectations.
Unit testing involves the lowest cost because each test targets to a limited
scope. Unit tests are fast and less time consuming. 


UNDERSTANDING THE ANGULAR TESTING OBJECT MODEL

One of the best advantages of using Angular is that it provides the Testing
Objects model. Now the question is why is this so important?  

The reason behind this is the execution of an  Angular application. The Angular
application is executed using the NgModule environment configuration. This means
that, all components and their dependencies e.g. standard module like
FormsModule and other Angular Services,  are finally managed by NgModule; so
naturally when we try to test the component, we need a similar environment to
instantiate component with its dependencies. 


Continue Reading >>
Posted by Mahesh Sabnis No comments:
Email ThisBlogThis!Share to TwitterShare to FacebookShare to Pinterest




ASP.NET CORE 3.1 UNIT TESTING USING XUNIT AND MOQ


In any software life-cycle, Testing is an important step for ensuring a good
quality software application. Typically, in case of web applications, testing
plays an important role. In the software applications, we have the following
major testing types:
 1. Unit Testing is the most popular testing methodology. The unit test helps to
    test every small unit of the source code. Unit testing is used to mock the
    dependency of the code so that the individual unit of the code is tested
    separately without including the dependency in the test code. Typically, in
    a software application, the unit is a class or a method in a class. If the
    class has any dependency, then to unit test the code, we mock the dependency
    to attain loose coupling. Unit Testing can be done by a developer and the
    developer can test the quality of the code.
 2. Integration Testing uses an approach where tests includes individual units
    and all these units are tested as a group. The advantage of the integration
    testing is to detect and expose faults during an interaction between these
    integrated units of the software application. Since, the integration testing
    uses all units in the test, writing integration test is a costlier approach.
 3. End-to-End Testing is an approach of testing the entire system. In this
    approach, the testing is implemented by considering every component of the
    software application right from the UI to the data persistence layer. This
    guarantees the expected workflow of the software application. The entire
    application is tested for the critical functionalities such as communication
    with third party components, databases, networks, etc.

Considering the various testing types, we can see that the cost of the Unit
Testing is very low where as End-to-End testing proves costlier, but
nevertheless important.

If we consider the number of tests required for software applications, then we
can say that we must write several unit tests. How many? As a thumb rule, the
overall number of methods written by developers in software applications, should
be the number of unit tests you write. Also, if we have conditional statements
in these methods, then we have to write one unit test per conditional statement.
Cumbersome, but totally worth the cost and time put into it.

This is also the reason why unit tests are the responsibility of the developer
or so to say if Test-Driven-Development approach (or user stories and test
cases) is understood by the developer, then the code can be bug-free. Figure 1
shows the summary of the testing methodologies.
       






Figure 1: Testing methodologies summary


In this article, we will be implementing Unit Testing of an ASP.NET Core 3.1
application. We will implement the Unit Test MVC Controller, API Controller by
mocking their dependencies.


Continue Reading >>
Posted by Mahesh Sabnis No comments:
Email ThisBlogThis!Share to TwitterShare to FacebookShare to Pinterest




ACCESSING AZURE TABLE STORAGE IN NODE.JS APPLICATIONS


Microsoft Azure Storage services provides features of storing NoSQL data in the
Table Storage. The Azure Table Storage stores schema-less data using Key/Value
pairs. Since the data store is schema-less, we can use Table Storage to store
the data for those applications that are designed and targeted to flexible data
capture. Although the data is stored as schema-less, it is easy to query the
data using simple querying mechanism.

You can consider using Table storage where you need not to use complex joins,
stored procedures for any data operations. 




TABLE STORAGE AND CREATING RESOURCE GROUP AND STORAGE ACCOUNT



Following are some of the features of Azure Table Storage

 * Table is a collection of entities. These entities does not enforce any
   schema. This provides a flexibility to store data for different set of
   properties for entities.
 * Entity is a set of properties. Conceptually we can map an entity with a table
   row on relational database. The max size of entity in Table is 1 MB.
 * Property is a name/value pair. We can have max 252 user defined properties in
   entity and along with these there are 3 system properties present in entity.
   These properties are RowKey, PartitionKey and Timestamp.
 * PartitionKey, this is the key based on which the data in the Table Storage is
   stored in logical partition. This provides query optimization while
   retrieving data from table storage.
 * RowKey, is the unique identification of the entity in the table storage.     
     

To use Azure Storage, we need a Microsoft Azure Subscription. Please visit this
link to create a free subscription. Make sure that you read all features and
limits of using Azure Free Subscription. Once you have a subscription, login to
the portal and you can start using its features.


Continue Reading >>
Posted by Mahesh Sabnis No comments:
Email ThisBlogThis!Share to TwitterShare to FacebookShare to Pinterest




USING MONGOOSE FRAMEWORK TO ACCESS AZURE COSMOS DB MONGODB API


Cosmos DB is a globally-distributed, multi-model database service on Microsoft
Azure. Cosmos DB provides database services like SQL API, MongoDB API,
Cassandra, Gremlin for storing NoSQL data.

We can create a Cosmos DB account to create a database and perform Read/Write
operations on these databases using various SDKs like .NET, .NET Core, Node.js,
JAVA etc. If you are working on  theJavaScript stack for building isomorphic
apps using Node.js and other JavaScript frameworks like Angular, Vue.js or
libraries like React.js, then you will mostly prefer to use MongoDB database for
storing data. 


Most of the isomorphic apps those which are using MongoDB database, uses
Mongoose framework to perform CRUD operations on the MongoDB Database. On
Microsoft Azure, if you are using MongoDB API database service of Cosmos DB to
store data,   there is a support available for Mongoose framework. This provides
a similar coding experience of using MongoDB in on-premise applications. 


In this article, we will see how to access Azure Cosmos DB for MongoDB API using
Node.js, Express application. Figure 1 explains the application structure


Continue Reading >>
Posted by Mahesh Sabnis No comments:
Email ThisBlogThis!Share to TwitterShare to FacebookShare to Pinterest




CREATING WEB APPLICATIONS USING MERN STACK


MongoDB: MongoDB is a cross-platform document-oriented database program. It is a
NoSQL Database. The data is stored in JSON document format and this database can
store images in Base64 encoded format. More information on MongoDB can be read
from this link.



Express.js: This is a Web Application Framework for Node.js. We can use this for
building REST APIs and also for building Web Applications. More information on
Express.js can be read from this link.


React.js makes it painless to create modern front-end applications. This library
provides an easy approach for building interactive views. 

Node.js: This is an open-source, cross-platform JavaScript runtime environment
used to run JavaScript code out-of-browser. We use Node.js for server-side
JavaScript execution. More information can be read from this link.

The Component is a major building block of a React.js application. Component is
the object that contains data, logic and user interface (UI) for the View. We
can build an application with complex Views  using React.js components. 

In JavaScript full stack applications, we can use JavaScript object model for
End-to-End apps that varies  from UI to Database. We use MongoDB,
Express.js, React.js and Node.js for designing such applications, which are
collectively also knows as MERN apps. In this article, we will build a complete
JavaScript application based on MERN a.k.a the MERN stack.   



Continue Reading >>
Posted by Mahesh Sabnis No comments:
Email ThisBlogThis!Share to TwitterShare to FacebookShare to Pinterest




FILE UPLOAD USING ASP.NET CORE WEB API 3.1 AND REACT.JS CLIENT APPLICATION


In this post we will see how to upload files (jpeg/png) to the ASP.NET Core 3.1
WEB API. We all know that WEB APIs are mainly used for Data Communication using
JSON format across applications. But what if we want to use WEB APIs for
accepting binary files from the client applications? 


In ASP.NET Core WEB API, the Request property of the type HttpRequest object
from the ControllerBase class can be used to read the FormData posted by the
client application. The following figure explains the approach of the
application development




Figure 1: Uploading file from the Client Application to the ASP.NET Core WEB API

As seen in Figure 1, the WEB API project must be configured with Body Request
limit to allow how much HTTP request body size will be accepted to process
request. This is the FromData posted by the client application. The Static File
middleware must be configured to define which folder will be used to store all
uploaded files.


Continue Reading >>
Posted by Mahesh Sabnis No comments:
Email ThisBlogThis!Share to TwitterShare to FacebookShare to Pinterest


Older Posts Home

Subscribe to: Posts (Atom)



NEW BOOK





USEFUL STUFF




 * Routing in React.js Single Page Application using React-Router-Dom
 * Fluent Validations in ASP.NET Core
 * Testing Angular Component using Jest
 * ASP.NET Core 3.1 Unit Testing using xUnit and Moq
 * Accessing Azure Table Storage in Node.js Applications




POPULAR POSTS

 * How to Refresh/Reload a Page using jQuery
 * 10 Free Tools to Load/Stress Test Your Web Applications
 * Execute JavaScript function from ASP.NET codebehind
 * What is the AntiForgeryToken and why do I need it? - ASP.NET MVC 101 series
 * LINQ – Left Join Example in C#
 * Hide a Table Column with a Single line of jQuery code
 * 5 jQuery Calendar Plugins that can be used on Websites
 * Free Open Source UML Tools
 * Create a Simple Image Slide Show using jQuery
 * ASP.NET MVC - Using Resource Files to Manage String Constants



 * Hi, I have an Image Button which when clicked sho... - Anonymous
 * i want to open a new exam portal window and close ... - vivek
 * @Naresh, please check your image scr path. - mubashir
 * @Raju MVC 4 or 5? - Suprotim Agarwal
 * Thanks for posting this. But when I use this my PO... - Raju




FEATURED





USEFUL LINKS

 * ASP.NET
 * jQuery
 * SQL Server
 * My Other Site
 * About Me
 * Contact Us




MOST TRENDING

 * Testing Angular Component using Jest
   In this tutorial, we will go through the steps for testing Angular Component
   by using the Jest framework. Since Angular is a widely used fro...
   
 * Round off Decimal to 2 places in jQuery
   I was recently working on a requirement where a textbox value had to be
   rounded off to 2 decimal digits and ‘$’ appended in front of it. Her...
   
 * Disable Squiggly or Wavy lines in Visual Studio
   The ‘Live Semantic Error feature’ in Visual Studio 2008 SP1 and onwards
   indicates problems in your code immediately as it detects one, witho...
   
 * Hide a Table Column with a Single line of jQuery code
   In one of my previous articles, Using jQuery to Delete a Row in a Table by
   just Clicking on it I showed you how to delete a Table Row. Cont...
   
 * HTML 5 Number Spinner Control
   The HTML 5 "spinner" or number input control provides an input for entering a
   number and also allow users to click up and down ar...
   
 * 10 Free Tools to Load/Stress Test Your Web Applications
   Wikipedia defines Load and Stress Testing as “ Load testing is the process of
   putting demand on a system or device and measuring its respon...
   
 * Convert String to Base64 and Base64 to String
   System.Text.Encoding class provides methods to convert String to Base64 and
   vice-versa. Convert String to Base64 First convert the strin...
   
 * Use jQuery to Detect if User has Scrolled to the Bottom or Top of a Page
   Here’s a simple way to detect if the user has scrolled to the Top or Bottom
   of the page using jQuery < html xmlns ="http://www.w3.or...
   
 * File Upload using ASP.NET Core WEB API 3.1 and React.js Client Application
   In this post we will see how to upload files (jpeg/png) to the ASP.NET Core
   3.1 WEB API. We all know that WEB APIs are mainly used for Dat...
   
 * Start and Stop a Timer in JavaScript
   In one of my previous posts, I had shown how to Execute a Function at Regular
   Intervals using JavaScript . One of the devcurry.com readers ‘...
   



 * GroupBy Clause - SQL Server vs MySQL
 * SQL Server Inner Join - Concepts and Best practices
 * SQL Server Query Pagination
 * Shrink a Live SQL Server Database and Logs - Caveats and Best Practices
 * SQL Server ISNULL() With Multi Column Names




LABELS

 * ASP.NET (286)
 * jQuery (221)
 * ASP.NET MVC (86)
 * JavaScript (85)
 * LINQ (83)
 * C# (79)
 * Silverlight (76)
 * Free Learning (63)
 * Product Releases (61)
 * VB.NET (60)
 * Visual Studio (60)
 * .NET (49)
 * Misc Ramblings (46)
 * Tools (46)
 * CSS (28)
 * Windows 7 (22)
 * WPF (20)
 * Free EBook (19)
 * HTML 5 (16)
 * ASP.NET Web API (15)
 * Sharepoint (15)
 * Azure (14)
 * ASP.NET AJAX (13)
 * Link List (13)
 * General (12)
 * MVC 101 (10)
 * KnockoutJS (9)
 * AngularJS (8)
 * ASP.NET Core (7)
 * WCF (7)
 * Architecture (6)
 * Technology (6)
 * Reviews (5)
 * WinRT (5)
 * Windows 8 Apps (5)
 * Contests (4)
 * Entity FW (4)
 * Node.js (4)
 * CosmosDB (3)
 * MongoDB (3)
 * React.js (3)
 * Tips (3)
 * Windows Vista (3)
 * Angular 6 (2)
 * BackboneJS (2)
 * Blogging Tools (2)
 * Express.js (2)
 * TypeScript (2)
 * Angular 10 (1)
 * AppHarbor (1)
 * Azure DevOps (1)
 * Docker (1)
 * EF Core (1)
 * IIS (1)
 * MERN (1)
 * MomentJS (1)
 * Regex (1)
 * Screencast (1)
 * Testing (1)




 * Deploying Blazor WebAssembly applications to Azure Static Web Apps
 * Diving into Azure Data Studio
 * Server-side JavaScript for .NET developers – Part I (Node.js fundamentals)
 * Async streams in C# – Deep Dive
 * Design Enterprise Integration Solutions using Azure single-tenant Logic Apps




ABOUT ME







Copyright © 2009-2021 All Rights Reserved for DevCurry.com | Terms and
Conditions | Contact Us




Powered by Blogger.



Diese Website verwendet Cookies von Google, um Dienste anzubieten und Zugriffe
zu analysieren. Deine IP-Adresse und dein User-Agent werden zusammen mit
Messwerten zur Leistung und Sicherheit für Google freigegeben. So können
Nutzungsstatistiken generiert, Missbrauchsfälle erkannt und behoben und die
Qualität des Dienstes gewährleistet werden.Weitere InformationenOk