• Stars
    star
    1,156
  • Rank 38,775 (Top 0.8 %)
  • Language
    JavaScript
  • License
    MIT License
  • Created over 9 years ago
  • Updated over 1 year ago

Reviews

There are no reviews yet. Be the first to send feedback to the community and the maintainers!

Repository Details

Cross-platform web development with Visual Studio Code, C#, F#, JavaScript, ASP.NET Core, EF Core, React (ReactJS), Redux, Babel. Single-page application boilerplate.

ASP.NET Core Starter Kit  

ASP.NET Core Starter Kit is a real-world boilerplate and tooling for creating single-page web applications (SPA) oriented towards progressive enhancement design, cross-platform compatability and component-based UI architecture. It is built upon best of breed technologies including .NET Core, Kestrel, EF Core, Babel, Webpack, React, Redux, CSS Modules, React Hot Loader and more. This boilerplate comes in both C# and F# flavors.

See demo, docs  |  Follow us on Gitter or Twitter  |  Learn React.js, ES6 and ASP.NET Core  |  Visit our sponsors:

Hiring

Features

    ✓ Component-based front-end development via Webpack, CSS Modules and React (see webpack.config.js)
    ✓ Modern JavaScript syntax (ES2015+) via Babel; modern CSS syntax (CSS3+) via PostCSS
    ✓ Application state management via Redux (see client/store.js)
    ✓ Universal cross-stack routing and navigation via path-to-regexp and history (see client/routes.json)
    ✓ Code-splitting and async chunk loading with Webpack and ES6 System.import()
    ✓ Hot Module Replacement (HMR) /w React Hot Loader
    ✓ Lightweight build automation with plain JavaScript (see run.js)
    ✓ Cross-device testing with Browsersync
    ✓ Git-based deployment to Azure App Service (see run.js/publish)
    ✓ 24/7 community support on Gitter or StackOverflow; consulting and customization requests on Codementor

Directory Layout

.
├── /.vscode/                   # Visual Studio Code settings
├── /build/                     # The folder for compiled output
├── /client/                    # Client-side app (frontend)
│   ├── /components/            # Common or shared UI components
│   ├── /utils/                 # Helper functions and utility classes
│   ├── /views/                 # UI components for web pages (screens)
│   ├── history.js              # HTML5 History API wrapper used for navigation
│   ├── main.js                 # Entry point that bootstraps the app
│   ├── router.js               # Lightweight application router
│   ├── routes.json             # The list of application routes
│   └── store.js                # Application state manager (Redux)
├── /client.test/               # Unit and integration tests for the frontend app
├── /docs/                      # Documentation to the project
├── /public/                    # Static files such as favicon.ico etc.
│   ├── robots.txt              # Instructions for search engine crawlers
│   └── ...                     # etc.
├── /server/                    # Web server and data API (backend)
│   ├── /Controllers/           # ASP.NET Web API and MVC controllers
│   ├── /Models/                # Entity Framework models (entities)
│   ├── /Views/                 # Server-side rendered views
│   ├── appsettings.json        # Server-side application settings
│   ├── Startup.cs              # Server-side application entry point
│   └── web.config              # Web server settings for IIS
├── /server.test/               # Unit and integration tests for the backend app
│── jsconfig.json               # Visual Studio Code settings for JavaScript
│── package.json                # The list of project dependencies and NPM scripts
│── run.js                      # Build automation script (similar to gulpfile.js)
└── webpack.config.js           # Bundling and optimization settings for Webpack

Prerequisites

Getting Started

Step 1. Clone the latest version of ASP.NET Core Starter Kit on your local machine by running:

$ git clone -o aspnet-starter-kit -b master --single-branch \
      https://github.com/kriasoft/aspnet-starter-kit.git MyApp
$ cd MyApp

Alternatively, scaffold your project with Yeoman:

$ npm install -g yo
$ npm install -g generator-aspnetcore
$ yo aspnetcore

Step 2. Install project dependencies listed in project.json and package.json files:

$ npm install                   # Install both Node.js and .NET Core dependencies

Step 3. Finally, launch your web app:

$ node run                      # Compile and lanch the app, same as running: npm start

The app should become available at http://localhost:5000/. See run.js for other available commands such as node run build, node run publish etc. You can also run your app in a release (production) mode by running node run --release, or without Hot Module Replacement (HMR) by running node run --no-hmr.

How to Deploy

Before you can deploy your app to Azure App Service, you need to open Web App settings in Azure Portal, go to "Deployment Source", select "Local Git Repository" and hit [OK]. Then copy and paste "Git clone URL" of your Web App into run.js/publish file. Finally, whenever you need to compile your app into a distributable format and upload that to Windows Azure App Service, simply run:

$ node run publish              # Same as running: npm run publish

How to Update

We work hard on keeping the project up-to-date and adding new features. Down the road, after starting a new web application project based on this boilerplate, you can always fetch and merge the latest changes from this (upstream) repo back into your project by running:

$ git checkout master
$ git fetch aspnet-starter-kit
$ git merge aspnet-starter-kit/master 

Alternatively, pull the latest version of this repository into a separate folder and compare it with your project by using a diff tool such as Beyond Compare.

How to Contribute

Anyone and everyone is welcome to contribute to this project. The best way to start is by checking our open issues, submit a new issues or feature request, participate in discussions, upvote or downvote the issues you like or dislike, send pull requests.

Learn React.js, ES6 and ASP.NET Core

🎓   React.js Training Program by Tyler McGinnis
🎓   React for Beginners and ES6 Training Course by Wes Bos
📗   React: Up & Running: Building Web Applications by Stoyan Stefanov (Aug, 2016)
📗   Getting Started with React by Doel Sengupta and Manu Singhal (Apr, 2016)
📗   You Don't Know JS: ES6 & Beyond by Kyle Simpson (Dec, 2015)
📗   C# 6 and .NET Core 1.0: Modern Cross-Platform Development by Mark J. Price (Mar, 2016)
📗   Professional C# 6 and .NET Core 1.0 by Christian Nagel (Apr, 2016)

Related Projects

Get in Touch

License

Copyright © 2014-present Kriasoft. This source code is licensed under the MIT license found in the LICENSE.txt file. The documentation to the project is licensed under the CC BY-SA 4.0 license.


Made with ♥ by Konstantin Tarkus (@koistya) and contributors

More Repositories

1

react-starter-kit

The web's most popular Jamstack front-end template (boilerplate) for building web applications with React
TypeScript
22,474
star
2

react-firebase-starter

Boilerplate (seed) project for creating web apps with React.js, GraphQL.js and Relay
JavaScript
4,493
star
3

graphql-starter-kit

💥 Monorepo template (seed project) pre-configured with GraphQL API, PostgreSQL, React, and Joy UI.
TypeScript
3,822
star
4

Folder-Structure-Conventions

Folder / directory structure options and naming conventions for software projects
1,834
star
5

universal-router

A simple middleware-style router for isomorphic JavaScript web apps
TypeScript
1,694
star
6

isomorphic-style-loader

CSS style loader for Webpack that is optimized for isomorphic (universal) web apps.
JavaScript
1,269
star
7

node-sqlite

SQLite client wrapper around sqlite3 for Node.js applications with SQL-based migrations API written in Typescript
TypeScript
867
star
8

react-app

Create React App with server-side code support
JavaScript
614
star
9

babel-starter-kit

🐠 Babel Starter Kit is a project template for authoring and publishing JavaScript libraries
JavaScript
555
star
10

react-decorators

A collection of higher-order ReactJS components
JavaScript
231
star
11

node-starter-kit

Node.js / GraphQL project template pre-configured with TypeScript, PostgreSQL, login flow, transactional emails, unit tests, CI/CD workflow.
TypeScript
154
star
12

static-site-starter

Static Website Starter Kit (static site generator) powered by Gulp, Jade, Bootstrap, LESS and BrowserSync. It can automatically deploy your website to GitHub Pages via Travis CI.
JavaScript
136
star
13

angular-vs

AngularJS + ASP.NET Web Api + TypeScript - Single Page Application (SPA) Starter Kit for Visual Studio
JavaScript
127
star
14

AspNet.Identity

Entity Framework (EF) Database-First Providers, Database Schema and Samples for ASP.NET Identity 2.0
C#
122
star
15

AngularJS-SPA-Template

AngularJS SPA Template for Visual Studio is a project skeleton for a simple single-page web application (SPA) built with AngularJS, Bootstrap, and ASP.NET (MVC, Web Api, SignalR).
CSS
104
star
16

hyperapp-render

Render Hyperapp to an HTML string with SSR and Node.js streaming support.
JavaScript
103
star
17

cloudflare-starter-kit

Template (boilerplate) repository for scaffolding Cloudflare Workers projects
TypeScript
103
star
18

fsharp-starter-kit

Cross-platform web development with Visual Studio Code, C#, F#, JS, ASP.NET Core, EF Core, React (ReactJS), Babel and Webpack. Demo =>
JavaScript
88
star
19

web-auth-library

Authentication library for the browser environment using Web Crypto API
TypeScript
83
star
20

TDAmeritrade

TD Ameritrade Client Library for .NET. Helps developers integrate custom solutions with the TD Ameritrade Trading Platform.
C#
76
star
21

amibroker

AmiBroker .NET SDK - An open source plug-in project template and community plug-ins for AmiBroker
C#
67
star
22

knex-types

Generate TypeScript definitions (types) from a PostgreSQL database schema.
TypeScript
63
star
23

hyperapp-starter

Boilerplate and tooling for authoring modern web applications with Hyperapp and Node.js.
JavaScript
61
star
24

react-component-starter

Skeleton project template for a stand-alone React component. NOTE: This project is currently NOT maintained. You may want to check https://github.com/kriasoft/babel-starter-kit instead
JavaScript
50
star
25

app-starter-kit

A front-end web application template based on HTML5 Boilerplate and enhanced with LESS style sheets and Gulp.js build system (a newer promising alternative to Grunt.js)
JavaScript
45
star
26

SPA-Seed.Front-end

A single-page application (SPA) project template (aka SPA seed project), which has a pre-configured build system, JavaScript bundling and dependency resolution, unit and integration test runners, minimization and optimization for production deployments.
CSS
40
star
27

react-page-context

React Page Context allows to manage document's title, description and other meta tags, as well as <link> and <script> elements from inside regular React components via context.page context variable
JavaScript
40
star
28

market-data

KriaSoft Market Data Server - A local database server with quotes and trade-related data associated with equity, fixed-income, financial derivatives, currency, and other investment instruments.
32
star
29

ASP.NET-Solution

ASP.NET solution / project template for a typical web application, pre-configured with Git, Gulp.js (or Grunt), NuGet and StyleCop development tools. It is well suited for building a single-page web application (SPA).
CSS
32
star
30

site-sdk

Web Application Starter Kit (aka Site SDK) is a solution / project template for building ambitious web applications on top of the AngularJS, ASP.NET Web Api, Entity Framework, Enterprise Library, and Windows Azure. Need help? Email me at [email protected]
JavaScript
27
star
31

pre-render

Convert a single-page app (SPA) into a fully pre-rendered functional website before deploying it to a CDN
JavaScript
25
star
32

image-resizing

Node.js backend (middleware) for dynamic image manipulation needs (transform, resize, optimize)
TypeScript
23
star
33

cloudflare-client

Lightweight universal Cloudflare API client library for Node.js, Browser, and CF Workers
TypeScript
20
star
34

terraform-starter-kit

Getting started with Terraform
HCL
18
star
35

docker-node-ci

The Docker image based on the official "node" image optimized for a CI environment
18
star
36

node-pg-client

Promise-based wrapper for `node-postgres` library designed for easy use with ES7 async/await.
JavaScript
16
star
37

webpack-middleware

Run Webpack compiler as Express.js/Browsersync middleware
JavaScript
16
star
38

graphql-api-examples

Code examples for GraphQL Start (tutorial) ⁠— How to build a GraphQL API on Node.js stack
JavaScript
10
star
39

SPA-Seed.Front-end.AngularJS

A single-page application (SPA) project template based on AngularJS
CSS
9
star
40

envars

Securely load environment variables (configuration settings) from .env files with support of Google Secret Manager.
JavaScript
9
star
41

MembershipDatabase

Membership database seed project created with SQL Server Data Tools (SSDT) for building a custom ASP.NET Identity / Membership solution for a typical web application using Database First development approach
9
star
42

cloudflare-ips

The list of CloudFlare IPs (IP ranges) to be used in the "trust proxy" (behind proxy) configurations
JavaScript
8
star
43

hyperapp-tools

Build automation tools for Hyperapp projects
JavaScript
7
star
44

jwt-passport

Passport.js framework that uses JWT for sessions
JavaScript
7
star
45

create-dns-record

Create DNS Record Action for GitHub
JavaScript
7
star
46

create-data-api

Project template for authoring data API backends with PostgreSQL, Redis, Passport.js and GraphQL.
JavaScript
6
star
47

component-routing

Component-based routing archiecture for single-page applications (SPA)
6
star
48

monorepo-example

Tips and tricks for setting up monorepo project structure for a typical web application.
JavaScript
5
star
49

rsb.kriasoft.com

Create React App + Relay Modern (DEMO)
JavaScript
5
star
50

delete-dns-record

Delete DNS Record Action for GitHub
JavaScript
5
star
51

reactstarter.com

React Starter Kit Homepage
CSS
4
star
52

check-version

Check Version Action for GitHub
JavaScript
4
star
53

restart

Restart Node.js app in development mode
JavaScript
4
star
54

data

Extensions library for Microsoft Entity Framework 4.2
C#
4
star
55

graphqlstart.com

GraphQL Start (tutorial) ⁠— How to build a GraphQL API on Node.js stack
4
star
56

react-components

Reusable React components
CSS
4
star
57

docker-gcloud

Google Cloud SDK bundled with Kubernetes CLI (kubectl)
3
star
58

AspNet

ASP.NET Identity Database is a SQL database project template (SSDT) which can be used to create a custom ASP.NET Identity / Membership provider using Database-First development approach.
C#
3
star
59

validator-fluent

Validation library for JavaScript/TypeScript with a strongly typed fluent API
TypeScript
2
star
60

core

KriaSoft Core Library - A collection of helper classes and utilities.
C#
2
star
61

kriasoft.github.io

CSS
2
star
62

bundle-webpack-plugin

Webpack plugin for emitting additional application bundles for Node.js, SSR, Cloudflare Workers, etc.
JavaScript
1
star
63

Diffbot

Diffbot Client Library for .NET - helps to extract article information (title, date, author, preview image etc.) for articles and blog posts with the Diffbot.com service.
C#
1
star
64

yeoman-generator

Yeoman Generator Starter Kit is a project template (boilerplate) for authoring Yeoman generators with modern JavaScript syntax (ES2015+) via Babel
JavaScript
1
star
65

simple-oauth2-clients

OAuth 2.0 clients for Google, Apple, Facebook, GitHub and other identity providers.
JavaScript
1
star
66

create-hyperapp-starter

The easiest way to start a new web application using Hyperapp.
JavaScript
1
star