Ik wil een web app maken, vlug. Hoe doe ik dat?

[? ?]

Ik wil een webapp maken voor m'n kindjes!

Ik heb wat boeken gekocht en ben ze allemaal beginnen lezen Angular (bah), React (wtf), Vue (looks legit), ASP.NET Core 2.

Ik kan: allerlei saaie zakelijke applicaties maken in C# WinForms, console programma's, services, backends, dll's maken , web script ik met jquery.

Maar dus, ik wil een web-app maken (SPA !), met in totaal een 10-20 tal schermen, waar de kindjes taken moeten afvinken, munten kunnen verdienen, ouders taken kunnen geven enz. Niet zo ingewikkeld.

Ik zou het gewoon in jquery doen, alles Single Page maken door zelf divs onzichtbaar te maken en bij te houden waar er genavigeerd wordt

Maar laten we dat vooral niet doen en eens de kennis in al die boeken benutten en iets nuttigs bijleren.
Wat me opvalt is dat er overal nog een app-layout bij komt (Materialize, etc) die in al deze frameworks wel mee te integreren is. Maar ook daar zie ik geen bomen door het bos.

Maar dus:
Hoe kan ik het snelst een mooie eenvoudige layout hebben die op een app lijkt (menu bar onderaan met icoontjes, terug navigeren in menu via swipe rechts) met SPA functionaliteit en een eenvoudige manier om via ajax calls dingen toe te voegen, wijzigen, verwijderen, ...

Een zetje in een goeie richting zou ik leuk vinden, zonder dat ik 1300 pagina's moet doorspitten om dan in te zien dat het misschien toch niet zo goed is als ik dacht. ASP.NET core wil ik enkel als backend inzetten in de toekomst, al zal het nu gewoon PHP/mysql worden.

't Is geen domme vraag. Ik wil gewoon deze maand iets af hebben. Ik heb 2 jaar geleden een Android app gemaakt die filmpjes kon opnemen, weergeven, enz. Al bij al viel dat nogal mee om te leren, voelde vrij vertrouwd aan; alleen wil ik geen Android ontwikkelaar zijn

React en consoorten voelt niet zo vertrouwd aan, maar ik wil ze graag leren kennen.

[j-a-s-p-e-r]

Ik heb wel eens wat gedaan met https://appery.io/
online platform gebaseerd op cordova + jquery + wat je verder wil gebruiken. Interface om interfaces te bouwen, deel met met services/apis te praten en evt een DB as service.
Hanige tool, zo zijn er vast nog wel meer van.

[The Eagle]

Als ik jou was zou ik eens naar low code of no code platforms kijken. Zijn er ook als open source. Google is je vriend

[Groax]

Je zou ook https://ionicframework.com/ kunnen proberen.

[ Voor 6% gewijzigd door Groax op 06-02-2019 11:21 ]

[BramV]

? ? schreef op woensdag 6 februari 2019 @ 10:37:

't Is geen domme vraag.

Wat is je vraag eigenlijk? Ik lees allemaal bla bla bla, veronderstelling, aanname en conclusie Maar eigenlijk bedoel je: ik zoek het ei van Columbus?

[ Voor 27% gewijzigd door BramV op 06-02-2019 12:42 ]

[Woy]

? ? schreef op woensdag 6 februari 2019 @ 10:37:
Ik heb wat boeken gekocht en ben ze allemaal beginnen lezen Angular (bah), React (wtf), Vue (looks legit), ASP.NET Core 2.

Waarom Bah en WTF? Angular (wel 2.0 <, want Angular.JS zou ik nu niet meer aan beginnen ) en React zijn toch wel de grootste en gangbaarste SPA frameworks, Vue is ook prima. Ik zou zeggen stel wat voorkeuren/voorwaarden op en pick one.

Maar laten we dat vooral niet doen en eens de kennis in al die boeken benutten en iets nuttigs bijleren.
Wat me opvalt is dat er overal nog een app-layout bij komt (Materialize, etc) die in al deze frameworks wel mee te integreren is. Maar ook daar zie ik geen bomen door het bos.

De app-layout staat inderdaad volledige los van het SPA framework wat je gebruikt, al zullen er inderdaad wel handige resources zijn om snel een app te kunnen scaffolden/bouwen.

Een zetje in een goeie richting zou ik leuk vinden, zonder dat ik 1300 pagina's moet doorspitten om dan in te zien dat het misschien toch niet zo goed is als ik dacht. ASP.NET core wil ik enkel als backend inzetten in de toekomst, al zal het nu gewoon PHP/mysql worden.

Voor Angular kan je gewoon de tutorials volgen op https://www.angular.io, die zijn erg uitgebreid. Voor React zijn ook prima tutorials: https://reactjs.org/tutorial/tutorial.html

moese schreef op woensdag 6 februari 2019 @ 11:20:
Je zou ook https://ionicframework.com/ kunnen proberen.

Ik zie de meerwaarde van deze opmerking niet zo erg. Ionic is zeker een mooi framework, maar leunt ook gewoon weer op Angular, dus ik zou eerst eens bij het begin beginnen.

[418O2]

Ionic kan je tegenwoordig met angular, react en vue gebruiken. Maar wel een beetje grof geschut.

Een spa met jQuery geeft me de kriebels. Maar ik durf je eigenlijk niks aan te raden, omdat je me nogal ongeduldig over komt.

Maar als ik iets zou moeten aanraden, is het vue

[juggle]

FF kort door de bocht: Laravel + Vue + MariaDB. Heb je zo wat staan.

Laravel (https://laravel.com/) is een perfect PHP framework op huidige standaarden. Daarnaast biedt het ecosysteem kant en klare admin pages en frameworks om direct wat te hebben. Ook kan je met Spark (betaald) een framework neerzetten die betalingen en een frontend al neerzet. Zie : https://spark.laravel.com/

Via Laracasts (https://laracasts.com/) kan je toegang krijgen tot heel veel les materiaal.

Gewoon gaan beginnen en thank me later :-)

[ Voor 11% gewijzigd door juggle op 06-02-2019 13:05 ]

[OverSoft]

moese schreef op woensdag 6 februari 2019 @ 11:20:
Je zou ook https://ionicframework.com/ kunnen proberen.

Ionic draait op Angular, dus dan zou hij EN Ionic EN Angular moeten leren.

ReactJS is niet heel moeilijk als je de basis begrepen hebt (kost je een paar uur) en kan qua ontwikkeling razendsnel zijn.

Zonder nieuwe technieken te leren blijf je steken op jQuery.
Kan ook prima zijn (ik heb er in het verleden veel webapps op gebouwd), maar wel veel meer werk.

Iets bouwen in een maand kan makkelijk, maar je moet natuurlijk wel weten hoe...

Ik heb zowel met Angular (Ionic), ReactJS en jQuery gewerkt (niet met Vue), maar als ik nu een nieuwe app zou moeten optuigen, zou ik zonder na te denken met React beginnen.

[ Voor 12% gewijzigd door OverSoft op 06-02-2019 13:06 ]

[q-enf0rcer.1]

Ik raad https://www.meteor.com aan. Heb dit framework tijdens mijn studie gebruikt om binnen no-time snel prototypes in elkaar te zetten. Je bent letterlijk binnen een paar minuten up and running met je eigen app.

[Woy]

Laten we het aanprijzen van specifieke frameworks hier verder maar achterwege, dan verzanden we uiteindelijk weer in een discussie waar iederen zijn favoriete framework aanraadt, en dat voegt hier niet zoveel toe. Zie ook Devschuur® Beleid: Welke programmeertaal moet ik leren?

[ Voor 6% gewijzigd door Woy op 06-02-2019 14:19 ]

[Laurens-R]

Ik vind de vraag totaal niet te beantwoorden. Zoals het er nu staat is bijna elk antwoord/framework/taal/etc goed. Maak een keuze en begin zou ik zeggen. Uiteindelijk zal je er altijd wat effort in moeten steken, is er een leercurve etc.

Je kan idd wel 20 frameworks gaan opnoemen, maar daar schiet je niks mee op imho.

[? ?]

Woy schreef op woensdag 6 februari 2019 @ 12:48:
[...]

Waarom Bah en WTF? Angular (wel 2.0 <, want Angular.JS zou ik nu niet meer aan beginnen ) en React zijn toch wel de grootste en gangbaarste SPA frameworks, Vue is ook prima. Ik zou zeggen stel wat voorkeuren/voorwaarden op en pick one.


[...]

De app-layout staat inderdaad volledige los van het SPA framework wat je gebruikt, al zullen er inderdaad wel handige resources zijn om snel een app te kunnen scaffolden/bouwen.

[...]

Voor Angular kan je gewoon de tutorials volgen op https://www.angular.io, die zijn erg uitgebreid. Voor React zijn ook prima tutorials: https://reactjs.org/tutorial/tutorial.html


[...]

Ik zie de meerwaarde van deze opmerking niet zo erg. Ionic is zeker een mooi framework, maar leunt ook gewoon weer op Angular, dus ik zou eerst eens bij het begin beginnen.

toon volledige bericht

Angular ben ik begonnen en toen zag ik dat ik 1.4 (?) aan het leren was, 2-way data-binding vond ik een top idee bv. En toen zag ik dat versie 2.0 uit was en konden ze niet genoeg benadrukken dat 2-way data binding toch niet top was en het toch niet zus en zo moest, maar zo. Ik was even gestopt en kwam terug om te zien dat Angular 3 overgeslaan was om direct naar 4 te gaan..En nu zitten ze aan 7.


Onsen en Meteor lijken me een goeie oplossing om snel tot resultaat te komen, evenals de aangeprezen online tools waarmee je eerder visueel aps kan ontwerpen. React is wat ik wil lezen/leren, maar dat duurt even.

Eigenlijk zocht ik gewoon "Onsen" e.d. Dat is prima te integreren in een framework of library.

[ Voor 22% gewijzigd door ? ? op 06-02-2019 14:38 ]

[Hydra]

? ? schreef op woensdag 6 februari 2019 @ 14:37:
React is wat ik wil lezen/leren, maar dat duurt even.

Nou. Doe dat dan. C# API met een React front-end. FF een learning curve maar er is genoeg leermateriaal voor.

[LOTG]

Ik zou gezien je kennis een C# backend met asp.net core (2.0+) in elkaar fietsen. Super easy, gewoon een webapi maken en daar is zat voor te vinden. Dan inderdaad met een frontend taal wat je graag wilt leren dat er voor plakken. Wij doen het vooral met Angular (7) maar het is maar wat je fijn vind. Kan eventueel ook met asp.net en razor pages.

Of doe eens gek en begin met Blazor (full stack C#) , wel preview.

[Falcon]

Ik zou via Github naar een voorbeeld project zoeken wat enigzins met je wensen over 1 komt en hiervan leren.

Genoeg serieuze voorbeelden aangeboden door bijv. Microsoft.

[Yucon]

Het is vast vloeken in de kerk, maar probeer eens microsoft powerapps.

YouTube: PowerApps Introduction

[Tim.k]

? ? schreef op woensdag 6 februari 2019 @ 10:37:
Ik zou het gewoon in jquery doen, alles Single Page maken door zelf divs onzichtbaar te maken en bij te houden waar er genavigeerd wordt

Maar laten we dat vooral niet doen en eens de kennis in al die boeken benutten en iets nuttigs bijleren.
Wat me opvalt is dat er overal nog een app-layout bij komt (Materialize, etc) die in al deze frameworks wel mee te integreren is. Maar ook daar zie ik geen bomen door het bos.

Yikes, dat het nog bestaat jQuery... Gelukkig zie je zelf ook in dat "onzichtbare divjes" en jQuery niet the way to go is. Dit is enorm achterhaald en zorgt alleen maar voor problemen.

Ik zou zeggen, kies wat je zelf prettig vindt. Geen enkel framework is "beter" dan de ander, ze hebben ieder hun unieke punten die ze fijn maken voor de gewenste behoeftes.

Ionic: Zeer gemakkelijk te leren, Angular met een mini jasje. Ingebouwde stijl per platform en eventueel te compilen tot een app. Helaas erg log maar voor een kleine applicatie enorm handig.
Angular: Zeer makkelijk te leren, niet de snelste, geen default style.
Vue: Makkelijk te leren, minimalistisch waardoor het af en toe wat meer werk kost dan Angular maar daarentegen wel sneller en duidelijker.
React: Wat lastiger maar nog altijd goed te doen, enorm snel, wel erg minimalistisch maar voldoende plugins beschikbaar.

Wat betreft de backend, in bovenstaande frameworks werk je normaliter API based. Het maakt dus geen drol uit wat je zou gebruiken. PHP met Laravel is gemakkelijk te leren door de duidelijke Laracasts (filmpjes die je uitleggen hoe het werkt). Maar aangezien je C# kennis hebt kun je net zo gemakkelijk een C# WebAPI project starten en daar de API in schrijven.

Ik raad je persoonlijk aan om Ionic te gebruiken. De applicatie hoeft niet performant te zijn omdat het klein is, duidelijke Android / iOS elementen aanwezig die afhankelijk van het apparaat toegepast worden waardoor de applicatie automatisch "gebruiksvriendelijk" is en je hebt de optie om er een daadwerkelijk App van te maken en eventueel wat native device functies tegenaan te gooien mocht dat handig zijn.

Combineer het eventueel met Google Firebase en je hebt wellicht geen server / API nodig https://firebase.google.com/

[ Voor 3% gewijzigd door Tim.k op 06-02-2019 20:42 ]

[JoeyPrr]

Het klinkt eerlijk gezegd alsof je beter af bent door gewoon HTML/CSS en ES6 te leren. Dit is prima te bouwen zonder hele frameworks te gebruiken... Nu snap ik dat je dingen wilt leren, maar het probleem van deze frameworks is dat ze voor de meest simpele dingen uit de kast getrokken worden en mensen de basis niet meer snappen (probeer nog maar eens iemand te vinden die CSS echt snapt).

https://dev.to/rishavs/ma...-ye-good-olde-js-es6-3eng
https://css-tricks.com/snippets/css/a-guide-to-flexbox
https://css-tricks.com/snippets/css/complete-guide-grid/

[ Voor 45% gewijzigd door JoeyPrr op 06-02-2019 21:45 ]

[Tim.k]

JoeyPrr schreef op woensdag 6 februari 2019 @ 21:33:
Het klinkt eerlijk gezegd alsof je beter af bent door gewoon HTML/CSS en ES6 te leren. Dit is prima te bouwen zonder hele frameworks te gebruiken... Nu snap ik dat je dingen wilt leren, maar het probleem van deze frameworks is dat ze voor de meest simpele dingen uit de kast getrokken worden en mensen de basis niet meer snappen (probeer nog maar eens iemand te vinden die CSS echt snapt).

https://dev.to/rishavs/ma...-ye-good-olde-js-es6-3eng
https://css-tricks.com/snippets/css/a-guide-to-flexbox
https://css-tricks.com/snippets/css/complete-guide-grid/

Inderdaad, kijk naar jQuery en het gebrek aan normale javascript kennis bij de gemiddelde web developer. Echter wil de TS snel en zonder veel moeite iets in elkaar zetten wat op de plain manier aanzienlijk langer zal duren dan een Ionic / Angular achtige oplossing.

[dynast]

Ik zou zeggen kijk eens naar Nuxt js framework volledig gebasseerd op Vue.
https://nuxtjs.org/guide#single-page-applications-spa-
Heel veel moois out-of-the-box. Bij install direct keuze uit diverse boilerplates, keuze uit serversoftware. No hassle en binnen no-time opgezet met genoeg begrijpelijke documentatie.

Heb in het verleden een tijd gewerkt met React en React-native dus heb wel vergelijkingsmateriaal. Was er op termijn wel klaar mee. Behoorlijk afgeknapt qua dependency hell en de imho te complexe state-management redux.

[CH4OS]

Een single page application willen maken op basis van jQuery?
Lijkt mij nu niet de meest handige en best presterende optie (anno 2019 zeker niet), dan kun je daar beter Vue, React of Angular voor gebruiken denk ik.

[ Voor 26% gewijzigd door CH4OS op 06-02-2019 21:59 ]

[Devilscomrade]

IMO:

Nieuw in de SPA wereld, snel ontwikkelen en plain js: Vue + Vuetify (+ Vuex).

Je gebruikt SPA al een tijdje en je vind js, en wil veel keuzes qua technieken: React.

Je bent typescript gewend / vind strong typing handig en wil een business / ietwat grotere applicatie maken: Angular.

Qua snelheid en performance heeft Angular meer overhead wat afneemt naar mate je applicatie groter wordt.

React en Vue zijn t.a.v. Angular sneller, met Vue als snelste en kleinste.

[ Voor 24% gewijzigd door Devilscomrade op 07-02-2019 07:08 ]

[BartBlackMagic]

Probeer aub ook eens Aurelia, indertijd gestart door een Angular 2 dev die het niet eens was met de richting die Angular uitging.
Wat ik er zo leuk aan vind is dat het geen zoveelste abstractielaag is boven op de DOM maar de standaarden net uitstekend volgt en erg unobtrusive en transparant aanvoelt. https://aurelia.io/

[ Voor 7% gewijzigd door BartBlackMagic op 07-02-2019 08:46 ]

[Ed Vertijsment]

Ik heb ervaring met aurelia vanaf het begin (enkele jaren, sinds beta) en nee, ik kan her niet aanraden.

Het is niet stable, veel “drijfzandgevoel” en lijkt gewoon te ver weg te denken van de realiteit.

Tenzij je heel goed weet wat je doet kan je verder gewoon beter bij iets (zie de eerdere suggesties) blijven met meer community support.

[Bartoz]

Het is mij nog niet geheel duidelijk of je nu een web-app, op te vragen via een URL, of een 'native' app wil maken die te installeren is via een app-store op je mobiel. Want dat vergt nogal een bepaalde aanpak.

[? ?]

Wauw heel veel leuke ideeën!
Vue + Vuetify lijkt me wel leuk om eerlijk te zijn. Heel vlug resultaat en enigszins begrijpbaar zo lijkt het en toch nog meer programmeer-feeling dan bv. app generator tools. Ik ga er eens mee aan de slag!

Dankje. Ik weet wel dat het een heel open vraag is, maar het is wel leuk om veel verschillende technologieën opgesomd te zien.

[gitaarwerk]

Yep. Ik snap ook niet wat je "wtf" vind aan React :-) Ik als front-end dev vind het fantastisch. Maar alle platformen hebben voor- en nadelen. React kun je heel goed schalen, maar vereist vooral veel opstart werk.

Kies iets waar je vind dat je het beste kan gebruiken/begrijpen, en kijk ook of het je doelen haalt. Begin vooral klein.

Progressive Web Apps (PWA), kun je zo gek maken als je wilt, en het kan laagdrempelig al best een appy gevoel geven. Als je offline toevoegd eraan, en iets als Google Firebase (hosting/db/authenticatie) doet, ben je al enorm ver.

[ Voor 6% gewijzigd door gitaarwerk op 08-02-2019 13:19 ]

[ocf81]

Ed Vertijsment schreef op vrijdag 8 februari 2019 @ 12:20:
Ik heb ervaring met aurelia vanaf het begin (enkele jaren, sinds beta) en nee, ik kan her niet aanraden.

Het is niet stable, veel “drijfzandgevoel” en lijkt gewoon te ver weg te denken van de realiteit.

Tenzij je heel goed weet wat je doet kan je verder gewoon beter bij iets (zie de eerdere suggesties) blijven met meer community support.

Ik heb aurelia wel een tijdje gebruikt en ik vond het toch veel makkelijker om op te pakken dan Angular 2. (ben nu geen frontend dev meer, gelukkig)