Skip to content

Commit b8a65ee

Browse files
jodebruijodebrui
authored
Merge pull request microsoft#105 from JocaPC/master
ReactJS Comments ASP.NET sample app
2 parents 84331a7 + c22aab7 commit b8a65ee

File tree

16 files changed

+11925
-1
lines changed

16 files changed

+11925
-1
lines changed

‎samples/features/json/comments/dotnet-react-jquery-app/.gitignore

Lines changed: 7 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,7 @@
1+
*.xproj.user
2+
.vs/*
3+
.vscode/*
4+
bin/*
5+
obj/*
6+
*.sln
7+
*.log

‎samples/features/json/comments/dotnet-react-jquery-app/CommentsReactApp.xproj

Lines changed: 19 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,19 @@
1+
<?xml version="1.0" encoding="utf-8"?>
2+
<Project ToolsVersion="14.0" DefaultTargets="Build" xmlns="http://schemas.microsoft.com/developer/msbuild/2003">
3+
<PropertyGroup>
4+
<VisualStudioVersion Condition="'$(VisualStudioVersion)' == ''">14.0</VisualStudioVersion>
5+
<VSToolsPath Condition="'$(VSToolsPath)' == ''">$(MSBuildExtensionsPath32)\Microsoft\VisualStudio\v$(VisualStudioVersion)</VSToolsPath>
6+
</PropertyGroup>
7+
<Import Project="$(VSToolsPath)\DotNet\Microsoft.DotNet.Props" Condition="'$(VSToolsPath)' != ''" />
8+
<PropertyGroup Label="Globals">
9+
<ProjectGuid>c8014cba-1952-414a-b78e-f60f9e5c5625</ProjectGuid>
10+
<RootNamespace>CommentsApp</RootNamespace>
11+
<BaseIntermediateOutputPath Condition="'$(BaseIntermediateOutputPath)'=='' ">.\obj</BaseIntermediateOutputPath>
12+
<OutputPath Condition="'$(OutputPath)'=='' ">.\bin\</OutputPath>
13+
<TargetFrameworkVersion>v4.6</TargetFrameworkVersion>
14+
</PropertyGroup>
15+
<PropertyGroup>
16+
<SchemaVersion>2.0</SchemaVersion>
17+
</PropertyGroup>
18+
<Import Project="$(VSToolsPath)\DotNet.Web\Microsoft.DotNet.Web.targets" Condition="'$(VSToolsPath)' != ''" />
19+
</Project>

‎samples/features/json/comments/dotnet-react-jquery-app/Controllers/commentsController.cs

Lines changed: 39 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,39 @@
1+
using Belgrade.SqlClient;
2+
using Microsoft.AspNetCore.Mvc;
3+
using System.Data.SqlClient;
4+
using System.IO;
5+
using System.Threading.Tasks;
6+
7+
namespace CommentApp.Controllers
8+
{
9+
[Route("api/[controller]")]
10+
public class commentsController : Controller
11+
{
12+
private readonly IQueryPipe SqlPipe;
13+
private readonly ICommand SqlCommand;
14+
15+
public commentsController(ICommand sqlCommand, IQueryPipe sqlPipe)
16+
{
17+
this.SqlCommand = sqlCommand;
18+
this.SqlPipe = sqlPipe;
19+
}
20+
21+
// GET api/comment
22+
[HttpGet]
23+
public async Task Get()
24+
{
25+
await SqlPipe.Stream("select * from Comments FOR JSON PATH", Response.Body, "[]");
26+
}
27+
28+
// POST api/comment
29+
[HttpPost]
30+
public async Task Post(string author, string text)
31+
{
32+
string comment = new StreamReader(Request.Body).ReadToEnd();
33+
var cmd = new SqlCommand( "insert into Comments values (@author, @text)");
34+
cmd.Parameters.AddWithValue("author", author);
35+
cmd.Parameters.AddWithValue("text", text);
36+
await SqlCommand.ExecuteNonQuery(cmd);
37+
}
38+
}
39+
}

‎samples/features/json/comments/dotnet-react-jquery-app/Program.cs

Lines changed: 25 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,25 @@
1+
using System;
2+
using System.Collections.Generic;
3+
using System.IO;
4+
using System.Linq;
5+
using System.Threading.Tasks;
6+
using Microsoft.AspNetCore.Hosting;
7+
using Microsoft.AspNetCore.Builder;
8+
9+
namespace TodoApp
10+
{
11+
public class Program
12+
{
13+
public static void Main(string[] args)
14+
{
15+
var host = new WebHostBuilder()
16+
.UseKestrel()
17+
.UseContentRoot(Directory.GetCurrentDirectory())
18+
.UseIISIntegration()
19+
.UseStartup<Startup>()
20+
.Build();
21+
22+
host.Run();
23+
}
24+
}
25+
}

‎samples/features/json/comments/dotnet-react-jquery-app/Properties/launchSettings.json

Lines changed: 28 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,28 @@
1+
{
2+
"iisSettings": {
3+
"windowsAuthentication": false,
4+
"anonymousAuthentication": true,
5+
"iisExpress": {
6+
"applicationUrl": "http://localhost:15194/",
7+
"sslPort": 0
8+
}
9+
},
10+
"profiles": {
11+
"IIS Express": {
12+
"commandName": "IISExpress",
13+
"launchBrowser": true,
14+
"launchUrl": "index.html",
15+
"environmentVariables": {
16+
"ASPNETCORE_ENVIRONMENT": "Development"
17+
}
18+
},
19+
"CommentApp": {
20+
"commandName": "Project",
21+
"launchBrowser": true,
22+
"launchUrl": "http://localhost:5001/index.html",
23+
"environmentVariables": {
24+
"ASPNETCORE_ENVIRONMENT": "Development"
25+
}
26+
}
27+
}
28+
}

‎samples/features/json/comments/dotnet-react-jquery-app/README.md

Lines changed: 87 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,87 @@
1+
# ASP.NET Core REST Web API that uses SQL/JSON functionalities
2+
3+
This project contains an implementation of ASP.NET Core REST API backend for [ReactJS Comments tutorial](https://facebook.github.io/react/docs/tutorial.html).
4+
In this example you will see how easily you can integrate Single-page apps implemented using ReactJS with SQL Server 2016 or Azure SQL Database using ASP.NET Core and JSON functions that are available in SQL Server 2016.
5+
6+
### Contents
7+
8+
[About this sample](#about-this-sample)<br/>
9+
[Before you begin](#before-you-begin)<br/>
10+
[Run this sample](#run-this-sample)<br/>
11+
[Sample details](#sample-details)<br/>
12+
[Disclaimers](#disclaimers)<br/>
13+
[Related links](#related-links)<br/>
14+
15+
<a name=about-this-sample></a>
16+
17+
## About this sample
18+
19+
- **Applies to:** SQL Server 2016 (or higher), Azure SQL Database
20+
- **Key features:** FOR JSON clause in SQL Server 2016/Azure SQL Database.
21+
- **Programming Language:** JavaScript/ReactJS, C#, Transact-SQL
22+
- **Authors:** Jovan Popovic
23+
24+
<a name=before-you-begin></a>
25+
26+
## Before you begin
27+
28+
To run this sample, you need the following prerequisites.
29+
30+
**Software prerequisites:**
31+
32+
1. SQL Server 2016 (or higher) or an Azure SQL Database
33+
2. Visual Studio 2015 Update 3 (or higher) or Visual Studio Code Editor with the ASP.NET Core 1.0 (or higher)
34+
35+
**Azure prerequisites:**
36+
37+
1. Permission to create an Azure SQL Database
38+
39+
<a name=run-this-sample></a>
40+
41+
## Run this sample
42+
43+
1. Create a database on SQL Server 2016 or Azure SQL Database.
44+
45+
2. From SQL Server Management Studio or Sql Server Data Tools connect to your SQL Server 2016 or Azure SQL database and execute [sql-scripts/setup.sql](sql-scripts/setup.sql) script that will create and populate Comments table.
46+
47+
3. From Visual Studio 2015, open the **CommentsReactApp.xproj** file from the root directory. Restore packages using right-click menu on the project in Visual Studio and by choosing Restore Packages item. As an alternative, you may run **dotnet restore** from the command line (from the root folder of application).
48+
49+
4. Locate Startup.cs file in the project, change connection string in ConfigureServices() method to reference your database (default value CommentsDb database on local instance with integrated security), and build solution using Ctrl+Shift+B, right-click on project + Build, Build/Build Solution from menu, or **dotnet build** command from the command line (from the root folder of application).
50+
51+
5. Run the sample app using F5 or Ctrl+F5 in Visual Studio 2015, or using **dotnet run** executed in the command prompt of the project root folder.
52+
1. Open /index.html Url to get all comments from database,
53+
2. Add new comment using the form below the list of comments.
54+
55+
<a name=sample-details></a>
56+
57+
## Sample details
58+
59+
This sample application shows how to create REST API service is used as beckend for ReactJS app.
60+
Front-end code stored in wwwroot folder is **unmodified** Facebook's [ReactJS sample comments app](https://facebook.github.io/react/docs/tutorial.html).
61+
ASP.NET Core Web API is used to implement REST Service called by Comments front-end app.
62+
Service uses FOR JSON clause that is available in SQL Server 2016 and Azure SQL Database.
63+
64+
<a name=disclaimers></a>
65+
66+
## Disclaimers
67+
The code included in this sample is not intended demonstrate some general guidance and architectural patterns for web development. It contains minimal code required to create REST API, and it does not use some patterns such as Repository. Sample uses built-in ASP.NET Core Dependency Injection mechanism; however, this is not prerequisite.
68+
You can easily modify this code to fit the architecture of your application.
69+
70+
<a name=related-links></a>
71+
72+
## Related Links
73+
74+
You can find more information about the components that are used in this sample on these locations:
75+
- [ASP.NET Core](http://www.asp.net/core).
76+
- [JSON Support in Sql Server](https://msdn.microsoft.com/en-us/library/dn921897.aspx).
77+
- [ReactJS](https://facebook.github.io/react/).
78+
- [JQuery](https://jquery.com/).
79+
80+
## Code of Conduct
81+
This project has adopted the [Microsoft Open Source Code of Conduct](https://opensource.microsoft.com/codeofconduct/). For more information see the [Code of Conduct FAQ](https://opensource.microsoft.com/codeofconduct/faq/) or contact [[email protected]](mailto:[email protected]) with any additional questions or comments.
82+
83+
## License
84+
These samples and templates are all licensed under the MIT license. See the license.txt file in the root.
85+
86+
## Questions
87+
Email questions to: [[email protected]](mailto: [email protected]).

‎samples/features/json/comments/dotnet-react-jquery-app/Startup.cs

Lines changed: 49 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,49 @@
1+
using Belgrade.SqlClient;
2+
using Belgrade.SqlClient.SqlDb;
3+
using Microsoft.AspNetCore.Builder;
4+
using Microsoft.AspNetCore.Hosting;
5+
using Microsoft.Extensions.Configuration;
6+
using Microsoft.Extensions.DependencyInjection;
7+
using Microsoft.Extensions.Logging;
8+
using System.Data.SqlClient;
9+
10+
namespace TodoApp
11+
{
12+
public class Startup
13+
{
14+
public Startup(IHostingEnvironment env)
15+
{
16+
var builder = new ConfigurationBuilder()
17+
.SetBasePath(env.ContentRootPath)
18+
.AddJsonFile("appsettings.json", optional: true, reloadOnChange: true)
19+
.AddJsonFile($"appsettings.{env.EnvironmentName}.json", optional: true)
20+
.AddEnvironmentVariables();
21+
Configuration = builder.Build();
22+
}
23+
24+
public IConfigurationRoot Configuration { get; }
25+
26+
// This method gets called by the runtime. Use this method to add services to the container.
27+
public void ConfigureServices(IServiceCollection services)
28+
{
29+
//const string ConnString = "Server=SERVERNAME.database.windows.net;Database=DATABASENAME;User Id=USERNAME;Password=PASSWORD";
30+
const string ConnString = "Server=.;Database=CommentsDb;Integrated Security=true";
31+
services.AddTransient<IQueryPipe>( _=> new QueryPipe(new SqlConnection(ConnString)));
32+
services.AddTransient<ICommand>( _=> new Command(new SqlConnection(ConnString)));
33+
34+
// Add framework services.
35+
services.AddMvc();
36+
37+
}
38+
39+
// This method gets called by the runtime. Use this method to configure the HTTP request pipeline.
40+
public void Configure(IApplicationBuilder app, IHostingEnvironment env, ILoggerFactory loggerFactory)
41+
{
42+
loggerFactory.AddConsole(Configuration.GetSection("Logging"));
43+
loggerFactory.AddDebug();
44+
45+
app.UseMvc();
46+
app.UseStaticFiles();
47+
}
48+
}
49+
}

‎samples/features/json/comments/dotnet-react-jquery-app/appsettings.json

Lines changed: 10 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,10 @@
1+
{
2+
"Logging": {
3+
"IncludeScopes": false,
4+
"LogLevel": {
5+
"Default": "Debug",
6+
"System": "Information",
7+
"Microsoft": "Information"
8+
}
9+
}
10+
}

‎samples/features/json/comments/dotnet-react-jquery-app/project.json

Lines changed: 53 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,53 @@
1+
{
2+
"dependencies": {
3+
"Belgrade.Sql.Client": "0.3.0",
4+
"Microsoft.AspNetCore.Mvc": "1.0.0",
5+
"Microsoft.AspNetCore.Server.IISIntegration": "1.0.0",
6+
"Microsoft.AspNetCore.Server.Kestrel": "1.0.0",
7+
"Microsoft.AspNetCore.StaticFiles": "1.0.0",
8+
"Microsoft.Extensions.Configuration.EnvironmentVariables": "1.0.0",
9+
"Microsoft.Extensions.Configuration.FileExtensions": "1.0.0",
10+
"Microsoft.Extensions.Configuration.Json": "1.0.0",
11+
"Microsoft.Extensions.Logging": "1.0.0",
12+
"Microsoft.Extensions.Logging.Console": "1.0.0",
13+
"Microsoft.Extensions.Logging.Debug": "1.0.0",
14+
"System.Data.SqlClient": "4.1.0"
15+
},
16+
17+
"tools": {
18+
"Microsoft.AspNetCore.Server.IISIntegration.Tools": {
19+
"version": "1.0.0-preview1-final",
20+
"imports": "portable-net45+win8+dnxcore50"
21+
}
22+
},
23+
24+
"frameworks": {
25+
"netcoreapp1.0": {
26+
"dependencies": {
27+
"Microsoft.NETCore.App": {
28+
"version": "1.0.0",
29+
"type": "platform"
30+
}
31+
}
32+
},
33+
"net46": {}
34+
},
35+
36+
"buildOptions": {
37+
"emitEntryPoint": true,
38+
"preserveCompilationContext": true
39+
},
40+
41+
"publishOptions": {
42+
"include": [
43+
"wwwroot",
44+
"Views",
45+
"appsettings.json",
46+
"web.config"
47+
]
48+
},
49+
50+
"scripts": {
51+
"postpublish": [ "dotnet publish-iis --publish-folder %publish:OutputPath% --framework %publish:FullTargetFramework%" ]
52+
}
53+
}

0 commit comments

Comments
 (0)