Web (ASP.NET Core MVC) + Mobile (Xamarin.Android) - c#

I'm trying to build an application which will have a Web (ASP.NET Core MVC) and Mobile (Xamarin.Android) but I faced some questions as I started to work about the architecture of application.
My start was with the web version by splitting my application into 3 projects:
MyApplication.Data
MyApplication.Entities
MyApplication.Web
My questions are about where I should keep some parts of my code:
the Repositories and IRepositories in the .Data project or in a separated project, let say MyApplication.Services?
the ViewModels in the .Data project, in the .Entities project or in the .Web project?
Is there anything else I should consider?
What are the best practices?
I would appreciate all your advices
Thanks in advance

Related

VS Solution Configuration for Web API / MVC

I've been working in ASP.Net WebForms for the last 10 years and am trying to move myself into some more current technologies. I therefore am just doing a small Todo list project with the following outcomes.
Setup a central SQL DB
Create an ASP.Net Core Web API project to handle data requests
Have a ASP.Net Core MVC project that has a web interface
Create a PWA application to install on both iOS and Android
I have completed steps 1 and 2. I have got to step 3 and not sure how to configure the MVC app. I have a few questions around how I should set this up.
Please note that I have setup the Web API project with .Net Core 3.1 and have used Entity Framework and so therefore have a DB Context.
Should I house the MVC project in the same solution as the Web API project.
If I do house the MVC project in the same solution should I be calling the DBContext directly (c# not javascript) from the WebAPI (setup as a reference) or should I be calling the Web API controllers directly?
If I do house the MVC project and the web API project in the same solution - when I go to deploy this real world will I be able to separate the 2 projects as different hosts so that my WPA can get to the Web API.
Should I have the MVC project completetly seperated and consume the WebAPI project as an external project.
Thanks
2.
This can be organized in many ways. I can tell you how I would proceed.
(Assuming you are moving to .net core world).
I will try to describe how to organize your solution in separate projects, and I will assume you want to use entity-framework, repository and unit of work patterns for DB access.
I would create the following projects in my solution:
one .NET Standard project to hold only models (entities and DTO's) - name it "YourNamespace.Models"
one .NET Standard project to hold repository and unit of work contracts/interfaces - name it "YourNamespace.Contracts"
one .NET Standard project to be your data access layer - name it "YourNamespace.DAL". This is where you install EF Core, where you would have your entities configurations (if using Fluent API), your migrations would be here also (if needed), your repositories implementations, as well as the unit of work and database context.
one .NET Standard project for your services - name it "YourNamespace.Services"
one API project for your API controllers/REST services - name it "YourNamespace.TodoAPI"
one MVC project for MVC controllers - name it "YourNamespace.TodoMVC"
This structure is nice for using dependency injection for your services and anything else you need.
Make sure to select the Multiple Startup Projects option under Set StartUp Projects (right-click on your solution).
Select both API and MVC as startup projects.
Something similar is described here

.NET Core Application link between projects

I have recently started a .net core project and I was wondering what the structure of typical projects are like?
I can see in some other web apps that they have things like account.website.com or analytics.website.com. Are these subdomains their own web projects under the same solution?
If so, How do they point the users to these links from app.website.com to account.website.com?
Currently this is the structure of my web project:
AppOne.Admin
AppOne.App
AppOne.ClassLibrary
AppOne.Data
I am unsure of how to link my Admin to App in terms of using #Url.Action() or RedirectToAction. Is that possible?

How to deploy asp.net core 2.1 MVC application as windows service using topshelf

I want to deploy an asp.net core 2.1 MVC application as a window service using top shelf.
Is it possible? If yes please share how. Not able to find anything good on web regarding .net core + mvc with topshelf.
Any help would be appreciated.
There isn't really a need for Topshelf to run dotnet core applications as Windows Service.
Dotnet core offers different hosting models.
Help link

How can I merge Asp.net core SPA (Single page Application) and Asp.net core Web Application into a seperate project

I have two separate projects in solution folder:
Project A.) SPA (based on Asp.net core 2.0).
Project B.) Asp.net core Web Application.
I want them merged into a single project.
I tried to put "Project A" into area section in newly created project (Asp.net core Web Application) but that did not work.
What will be the work around for this problem. Sorry for any grammatical mistake.

Add Angular 4 to an ASP.NETCore Project

I want to utilize Angular 4 in my ASP.NetCore 1.1 project, within Visual Studio 2017 (read as: *.csproj file)
Previously with ASP.NET Core 1.0 and Visual Studio 2015, you could simply add AngularJS (1.x.x) into the project.json as a dependency and it would wire itself in.
Now, with ASP.NetCore and VS2017, the project.json file has gone away, and the only documentation I can find refers to STARTING an Angular 4 project by using the CLI and using the CLI to generate a NEW angular app. I don't really want a new project or have to refactor everything I have created to provide a service to a separate UI project. I just want to augment my app with some added client-side UI experience.
Any suggestions?
Update
This questions has been getting a lot of views and the information is of little help so I'm providing this update.
Visual Studio 2017 (*.csproj)
Asp.Net Core 2.0 + Angular (v2.0~v4.0) :: Use the built in template! Best option IMO.
Asp.Net Core 1.X + Angular (v2.0~v4.0)
Create VS Project.
Create Angular Project via Angular CLI
Configuration and setup details : Link
Visual Studio 2015 (project.json)
Tooling: up to version -preview2 - No further updates, all new .NET Core features will be moving to VS 2017
Asp.Net Core 1.X + Angular (v2.0~v4.0)
Asp.Net Core Template Pack
Note: I wouldn't endorse a bad VS Plugin, Mads Kristensen does good work.
Configuration and setup details : Blog post
Asp.Net Core 1.X + AngularJS (~1.5)
Configuration and setup details : Microsoft Tutorial
Asp.Net MVC 5 + AngularJS (~1.5)
Pluralsight Blog Guide
Notes: There are many other ways to get Angular to work with ASP.Net / .NetCore projects such as NPM, Bower, NuGet, etc. I tried to highlight the ones which are simple and actually work. Also these are in line with the direction Microsoft is moving in, according to the Pluralsight blog post above.
[i am aware you didn't ask this specifically but just wanted to share a thought which is very relevant in my opinion]
I was at the exactly the same point a few months ago and i decided going with angular cli. and i thank God i made that decision.
Uncomparably more clear and it actually put things how they should be: .net core web api backend and completely separated angular client. just exactly the same as you wouldn't put your iphone/android app into VS solution, there is no real reason to put angular one neither.
UPDATE
Either use MVC with Razor, OR use Angular as a SPA, and if you use Angular, use the Angular CLI.
And if you use angular, feed data into it with asp.net (core) Web Api as a REST backend
I can see how this is confusing, but dee zg is correct. You're going to want two separate projects. One will be the .net core backend api (REST) and the other will be the Angular 2 spa. There will be a complete separation.
With AngularJS, you could just drop in the js file into a razor view and call it a day. However, with Angular 2/4 and React, it's best to host each project in it's own solution. This might seem silly at the beginning, but when you build out your api, it can be easily future proofed by having the capability of also being consumed by mobile apps, desktop apps, etc.
I know there is a dotnet spa services angular cli powershell command for .net core, but it is really kind of a mess and actually outputs invalid html that could possibly be detrimental to SEO, etc. It's best, IMO, to just use the angular CLI in a separate project.
When it comes to production, you'll host the .net core api and the angular 2 projects separately.
It’s not totally clear to me what you mean by "Add Angular 4 to an ASP.NET Core Project", but one way to do this is the following:
Create an Angular 4 project (using angular-cli).
Create an ASP.NET Core project (using .NET Core CLI) in the same directory as the Angular project.
Adjust the webpack.config.js file (which is part of the angular-cli installation) in order to automatically put bundled files in the wwwroot directory (webpack will be responsible for this).
On my blog, I have a detailed tutorial demonstrating this approach.
I have been working on a Angular 4(SPA) and .Net core web api. You can check out the repository and you might get a better understanding.
I had to find solutions to many areas like authentication, authorisation, social login, MongoDB connector e.t.c
Hope this would save time for someone stumbling on this.
https://github.com/Sathya-B/Angular-.NetCore-MongoDB
I am using Angular 6 and ASP.NET CORE 2.1 but this might work on Angular 4.
CREATE A NEW ANGULAR PROJECT IN VS2017:
Create a new Web App in VS. The folder name should not contain '.' since
Angular will not accept it. For example: DatingApp-SPA. And then select 'Blank'.
Close VS so that it will not lock the folder for any permission
Navigate to the base path of the project folder.
Run 'ng new DatingApp-SPA'. This will add Angular goodies to the existing DatingApp-SPA project.
Open the solution again on VS.
CREATE A NEW COMPONENT:
Open command prompt and navigate to the project folder
Run the command:
ng generate component component-name-with-lowercase
This will generate the .html, .spec.ts, .ts, .css files and update the app.module.ts
CREATE A NEW SERVICE:
Open command prompt and navigate to the project folder
Run the command:
ng generate service _component-name-with-lowercase_
This will generate the .ts and .spec.ts by default in the \app folder. We can move these files on another folder like \app\_services

Categories

Resources