�ݺ�ߣ

ASP.NET 5 | MeetUp | 19-NOV-2015
1 JAAR
ASP.NET5
Onze ervaringen

■ wifi: ‘DigAnt Free Wifi’
■ hashtag: #digantcafe
■ instagram: @digipolis_antwerpen
■ twitter: @dgplsantwerpen
■ slideshare: http://www.slideshare.
net/digipolisantwerpen
■ linkedin: https://www.linkedin.
com/company/digipolis
■ facebook: https://www.facebook.com/Digipolis/
Some Info

ASP.NET 5
Bram Van Handenhoven | PL

“If I’d asked people what they wanted,
they would have asked for a faster horse.”
Henry Ford
Projecten, platformen & vernieuwing

Geïntegreerde architectuur
op basis van ervaringen platform A-Stad
Uitgangspunten & aanpak
Modulaire ontwikkeling
Tijdens analyse en ontwikkeling focus op herbruikbare componenten
Compacte opleveringen
met focus op performantie en gebruiksvriendelijkheid (UX – User Experience)
Stapsgewijs & gecontroleerd
evolueren naar een nieuwe platform, rekening houdend met
minimale impact op eindgebruikers, technische haalbaarheid en de parallelle projecten

Future-proof
Webgebaseerd
Licentievrij
Combo met Linux | Ubuntu | PostgreSQL | Atlassian ALM
Fade-in/fade-out met bestaande (.Net) technologieën en projecten
Technologische keuzes
→ ASP.NET 5 ←
beste match tussen
techn(olog)isch-organisatorische vereisten
en open source

Jasper Van Proeyen 19.11.2015
Tink

Werking Stad
■ Tientallen bedrijven
■ Honderden applicaties
■ Nood aan centraal gedachtegoed

UX gedachtegoed
Naar gebruikers:
■ Consistentie
■ Herkenbaarheid
■ Uniforme layout & (huis)stijl

UX gedachtegoed
Naar developers:
■ Sneller kunnen werken, minder overhead
■ Herbruikbaarheid
■ Betere service op front-end vlak

Proces
■ Concrete vraag
■ User stories
■ Wireframes
■ (Web) apps

Administratieve toepassingen
■ Lijsten
■ Formulieren
■ Contextuele search, complexe filtering
■ CRUD-acties
■ …

1+1=1
UX gedachtegoed + terugkerende elementen
= één front-end framework voor alle interne
tools van de Groep Stad Antwerpen…

Wat is Tink?
Tink is een op (Twitter) Bootstrap
geïnspireerd, in-house ontwikkeld front-end
framework dat als doel heeft om op een
modulaire manier complexe en data-rijke
applicaties duidelijk en gebruiksvriendelijk
vorm te geven.

Wat is Tink niet
■ Twitter Bootstrap:
● Groot
● Kan voor alles dienen
● Styling (CSS) + scripting (JS)
■ Het warm water heruitgevonden

Wat is Tink wel
■ Twitter Bootstrap fork
■ Focus op administratieve toepassingen
■ Kern + aparte componenten
■ Technologie-onafhankelijk

Wat is Tink uiteraard ook
■ Responsive
■ Mobile-first
■ Industry standards:
● HTML5
● CSS3

Nog enkele voordelen
■ Twitter Bootstrap syntax
■ Open source
■ Eén op één naast wireframes

Componenten
■ Gemakkelijk te gebruiken
■ Modulair
■ Mix met externe componenten
■ Momenteel enkel AngularJS

Themes
■ Digipolis
■ Stad
■ OCMW
■ Politie
■ Brandweer

Gebruik
bower install `tink-component`
http://github.com/tinkkit
en
http://tink.digipolis.be

Verbetering
GitHub fork
Code-aanpassingen
Pull request

Eigen component
GitHub fork van Tink skeleton:
http://github.com/tinkkit/tink-skeleton-angular
Gebruik Grunt tasks
Sharing is caring

Meer info
http://tink.digipolis.be
http://github.com/tinkkit
tink@digipolis.be

ASP.NET 5
Front-end demo
Willem De Nys | Ontwikkelaar

■ WWWroot
■ Dependencies
■ Bower.json
■ Gruntfile.js
■ Package.json
■ Project.json
Structuur Visual Studio 2015

■Whitelist
■Vergemakkelijkt standaard taken
■Geautomatiseerd (Grunt, Gulp)
wwwroot

■ Packet managers.
● NPM (serverside packages)
● Bower (clientside packages)
Dependencies

Bower.json
■ Toevoegen in lijst
■ Versie bepalen
■ Enventueel
"exportsOverride": {
"tink-timepicker-angular": {
"js": "dist/*.js"
}
}

Gruntfile.js
bower: {
install: {
options: {
targetDir: "wwwroot/lib",
layout: "byComponent",
cleanTargetDir: false,
cleanBowerDir: false,
verbose: true
}
}
}
■ Bower install
■ Files kopiëren naar wwwroot
■ Index.cshtml genereren
includeSource: {
options: {
basePath: "wwwroot/",
baseUrl: "~/",
},
myTarget: {
files: {
"WebUI/Views/Home/Index.cshtml":
"WebUI/Views/Home/IndexTemplate.cshtml"
}
}
}

Gruntfile.js
■ JS/html files in wwwroot te krijgen
■ Sass compilen
■ Files “watchen”
■ Custom tasks definiëren
grunt.registerTask("default",
["clean:app", "clean:lib", "bower:install", "clean:nodemodules", "sass:dev", "copy:scripts", "copy:styles", "copy:templates", "copy:content", "includeSource"]);

Angular injectie
■ Externe directives injecteren
■ Eigen directives:
duplicatie tegengaan
onderhoudbaar

DEVELOPMENT MET ASP.NET 5
Steven Vanden Broeck

JANUARI 2015
● Vernieuwing van de development stack
●
● Open source
● Recentste technologieën
● Modulair
● Toekomstgericht

ASP.NET 5 (formerly known as ASP.NET vNext)

ASP.NET 5 MODULAIR FROM-THE-GROUND-UP

ASP.NET 5 DNX RUNTIME
Multi-platform (dnx core voor Windows, Linux en OSX)
Side-by-side installaties

Project was al begonnen :
Web API met AngularJs front-end
omgezet naar ASP.NET 5 (beta 2) :
op 1 week
POC van 1 maand
werkbaar mits overhead
ASP.NET 5 VOOR DIGIPOLIS PROJECTEN

ASP.NET 5 BETA
● Beta 2 (januari)
● Breaking changes bij elke nieuwe beta
● Namespaces
● Packages
● Classes/methods/properties/interfaces
veranderd/verwijderd/verplaatst
●
● Servers en ALM stack ook telkens mee upgraden

ASP.NET 5 & WEB API
Unified framework (MVC + Web API)
Ontbrekende onderdelen in eerste beta’s
Cross-origin Resource Sharing (CORS)
Authenticatie
...
Ander gedrag
bv. Querystring mapping

ASP.NET 4.5 Web API :
http://myapp/klant?voornaam=Lef http://myapp/klant?voornaam=Lef&naam=Jebowski
KlantController :
public IHttpActionResult Get(string voornaam) public IHttpActionResult Get(string voornaam, string naam)
ASP.NET 5 & WEB API QUERYSTRING MAPPING

ASP.NET 5 Web API :
http://myapp/klant?voornaam=Lef http://myapp/klant?voornaam=Lef&naam=Jebowski
KlantController :
public IHttpActionResult Get(string voornaam) public IHttpActionResult Get(string voornaam, string naam)
ASP.NET 5 & WEB API QUERYSTRING MAPPING

ASP.NET 5 QUERYSTRING MAPPING UNIT TESTS

● Linux & Mono
● Nieuw voor .NET’ers
● Mono :
● bijna hetzelfde maar soms toch verschillend
●
ASP.NET 5 & MONO

OPEN SOURCE DATABASE
● PostgreSQL
● Met het nieuwe Entity Framework 7 ?

ENTITY FRAMEWORK 7 & POSTGRESQL

NPGSQL ENTITY FRAMEWORK 7 PROVIDER

�ݺ�ߣ

Meetup ASP.NET 5 19/11/2015

More Related Content

Meetup ASP.NET 5 19/11/2015