nordes / honosoft.dotnet.web.spa.projecttemplates Goto Github PK
View Code? Open in Web Editor NEW.Net Core 2.2 > SPA Application with VueJS/Vuex/WebPack 4/Picnic CSS/Fontello
License: MIT License
.Net Core 2.2 > SPA Application with VueJS/Vuex/WebPack 4/Picnic CSS/Fontello
License: MIT License
Other popular css framework: https://dzone.com/articles/top-10-lightweight-css-frameworks-for-building-fas
And also create some other template with typescript
It states that vuex is not yet implemented while it is.
OpenId? or basic Dotnet authorization?
Add a spinner when loading the data => FetchData
Also, fix the BaseIcon in order to also allow a spin (parameter). Default it will not spin, otherwise it adds the class to spin + use the i
instead of span
html element.
Somehow, the css is behaving wrongly with
a
tag. (Why?)Add a not found page (404)
Update the npm packages.
Babel/core -> 7.1.2
copy-webpack-plugin -> 4.5.4
Simple, but still require some time ;).
Add the icons from Fontello (build custom your font/icons).
For a small site it's more than enough.
See details at : https://webpack.js.org/guides/production/
We should have a different build for prod.
Also, instead of uglify, maybe think also to use https://github.com/webpack-contrib/babel-minify-webpack-plugin instead of uglify (Default)
In order to have some format that make sense (;
or none, etc.)
This is actually a bug due to it's current implementation.
I need to change the menu implementation in order to have the burger show, and put the titlebar as static (top) + burger menu.
Something similar...
Write proper Wiki pages.
Basically, kind of how to work with the template. At the same time update the about in the template to point to the wiki.
This is more a long running task, not an issue.
I will close
When a BG image is set in the SCSS it sometimes fails to set the proper URL.
(Not confirmed on latest version)
Because we're after 2000 ;).
For real, a front-end only in one language is quite rare today. Maybe this should be a template decision more than enforced.
I will be using a lazy json file which is loaded at runtime. This mean we could change the implementation to either use a service call or directly a "hard-coded" file.
Vue-i18n is quite a good plugin.
I did it in the past and my final implementation looked a bit like https://kuanhsuh.github.io/2017/09/16/How-to-implement-multi-language-with-Vue-i18n/
So... I should look at the complete article or my previous code and see which one I prefer.
In the vue template with a store, we should use the store + localstorage, and in the template without the store, we should use the storage directly.
As the title says.
Article can also be on honosoft.com
The specified framework 'Microsoft.AspNetCore.App', version '2.2.0' was not found.
Update the readme, new design image, new loader to avoid exception page, package update.
Show a sample where the data table have paging (temperature page).
I have redesigned on a personal project using better flexbox for menu and all. So it looks a bit more useful (top bar hiding when small screen, and left bar become top bar when minimizing with icon on top right).
I don't know how much time it will take to apply here ;).. .so I'll leave it as a todo.
Should it be done... it works, but it's not a great experience if you're in visual studio.
Package file:
"eslint-friendly-formatter": "^4.0.1",
"eslint-loader": "^2.1.1",
Webpack conf:
// Part of the export
stats: 'minimal', // https://webpack.js.org/configuration/stats/
// rules
{
test: /\.(js|vue)$/,
loader: 'eslint-loader',
enforce: 'pre',
include: [path.resolve(_rootDir, 'ClientApp')],
options: {
formatter: require('eslint-friendly-formatter'),
emitWarning: !isProduction, // You can also use emitError instead
configFile: '.eslintrc.js'
}
},
The Kestrel does not serve automagically the js files using gzip compression.
Some details on how to do it: https://www.softfluent.com/blog/dev/Enabling-gzip-compression-with-ASP-NET-Core
In our case, let's enable it by default for Kestrel especially. It's maybe a bit slower than IIS, but at least it enforces it.
As the title says.
So that when a user come back we push the user to the proper section of the site.
i.e.: I give a link http://mysite.com/MyPage (default: en)
User who receive it use the site in Japanese so he gets forwarded to : http://mysite.com/ja/MyPage
However, if the user goes on the page http://mysite.com/en/MyPage, it will sets the current user locale to EN.
Probably there`s already some kind of template for that.
Let the user consent about the cookies. Those templates are not yet using storage/cookies, but if the developer start doing it, then it should be displayed (EU law...)
So, basically it will become a component with a cookie or similar to keep the user agreement.
Right now we use /content/... instead of directly the real template name.
Using the i18n apply it in:
Right now the route was kind of hardcoded... but the real solution is to use the official UseSpa and AddSpaStaticFiles.
It's a common thing to have on many website. Maybe it should be part of the template "or not".
Basically create a sample using SignalR. It should be fairly easy and we should be using the vuex for that. It's like the perfect place to make our "front end store".
Params are not working due to the configuration in webpack.
It's easy to fix.
The routes are working, however, when we have no language selected (default), it fails if you push f5.
The main reason is the order of routing that cause a kind of conflicts. It thinks that it goes on /{something} which would be the home component with a language.
To fix, we simply have to move the home route at the end, add an order within the meta and then change the menu ordering.
This is not really an issue, it's more a look and feel of the startup.
Now it looks quite messy. I usually use extension methods. It hides a bit the complexity, however it gives a lot of readability which is not a bad thing in this situation.
The value is wrong due to a refactoring.
InvalidOperationException: The SPA default page middleware could not return the default page '/index.html' because it was not found, and no other middleware handled the request.
fresh install, simply dont run.
Simply add a dockerfile and an "automatic" deployment to heroku example (if possible).
The dockerfile, it's simple. For heroku "1 push" deploy button, I don't know yet how to do.
Should this be added or should it be a different template?
The same goes for the signalr and some other.
The left menu does not display properly after using a promisify "like" polyfill.
So, I either fix it or consider that menu as non IE friendly ;).
With many changes, comes an update for the readme.md
This is for the 1.2.0
A delay have been added on the API, but I think that we should simply put instead the fake delay in the front-end before doing the API call (first time). That way it would remove the latency.
Since I added the .
before the /dist
in the public path for the file to be published. This causes an issue when we use the hot reload.
The hot reload then use /dist/webpack_... instead of /webpack_... (websocket)
The fix is to simply ignore the .
before when we're not in production. Not the best solution, but it should be working.
Left menu in the new design should/can be collapsed. It was part of the original design. Now with the flex redesign it works as expected.
Create on https://blog.honosoft.com an article about the template. ;) why not. (French and/or English)
Add the appveyor badge.
I need some old bootstrap 4 vestiges ;)
Use the appveyor yaml file or use a powershell... (something like that)
The yaml in this case will be quite simple. Let's not use the vsix build yet. That way the build can pass.
To read: http://vsixgallery.com/guide/dev/
Move some of the content which is in the readme within the Wiki.
This will simplify the landing page/nuget page.
Add a base ref as a parameter. This allow to have a nginx server running the app as the front-end.
templateParameters: {
'baseHref': isProduction ? '/some-url/' : '/'
}
In the index.html
<base href="<%= baseHref %>" target="_blank">
related to #29
A declarative, efficient, and flexible JavaScript library for building user interfaces.
๐ Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
An Open Source Machine Learning Framework for Everyone
The Web framework for perfectionists with deadlines.
A PHP framework for web artisans
Bring data to life with SVG, Canvas and HTML. ๐๐๐
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
Some thing interesting about web. New door for the world.
A server is a program made to process requests and deliver data to clients.
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
Some thing interesting about visualization, use data art
Some thing interesting about game, make everyone happy.
We are working to build community through open source technology. NB: members must have two-factor auth.
Open source projects and samples from Microsoft.
Google โค๏ธ Open Source for everyone.
Alibaba Open Source for everyone
Data-Driven Documents codes.
China tencent open source team.