Web Essentials for VS20XX offers a bundling feature which I've used. I haven't ever really used the MVC bundling feature. Are there any major differences in functionality? Is it best practice to use the MVC?
In the actual case in question, I'm using OWIN/Katana, MVC 5.
In addition to Shoe's answer, I think these are also worth mentioning:
Less, Sass plugins often require extra work and problems: I have tried dotless, but it couldn't compile Bootstrap Less source, as it's engine was outdated. I have tried other plugin, which required JavaScript engine, which required installing C++ Redistributables on the server.
WebEssentials compiles, minifies and bundles files on save and build, while MVC bundling does that on AppStart. The effect is longer application start time, what can be a problem when IIS kills application often in a favour of other applications
There are a few differences. I don't think a "best practice" exists beyond what you want to work for. Obviously Web Essentials isn't going to be as integrated into MVC as the MVC bundler is. A few points on the MVC bundler.
The MVC bundler won't bundle Less, Sass, CS etc. without a plugin.
So if you have less files for example, you need something like
dotless.
It won't bundle images into sprites.
It supports file versioning so no action is required when jquery
goes from 2.0.0 to 2.0.1, though since bundles are generated on
application start it's a little harder to manage bundle versioning.
There is no manual building of bundles besides defining the Bundle
config file
Turning bundling and minification on/off is as easy as turning
on/off debug mode in the web config or enabling optimizations in the
bundle config.
It supports bundling of CDNs
When your server is running you can make edits to individual files and the bundle will regenerate at runtime
Related
JavaScript newbie here. I'm new to Angular2 and am currently learning about things like module-loaders (there's so many!), etc, so bear with me since my space of "unknown unknowns" is probably quite large.
I'm interested in creating a JavaScript based "Packaged Web App" for windows ("Packaged" in the sense that the JS is included in the Universal Windows Platform app).
One constraint to keep in mind is that I have severe limitations on the size of my packaged app. The smaller, the better.
With that in mind, I have a few specific questions that will hopefully expose the extent of my ignorance:
Without resorting to Electron or Ionic2, is it possible (also, is it a good idea) to create the offline experience in Angular2 and then only manually include the resulting transpiled .js files in my Visual Studio project?
How hard is it to manage the dependencies for these transpiled files? Are they entirely self contained?
Roughly how large would the minimum set of manually imported files end up being? When I use NPM to install angular2, it winds up being ~80mb - a large portion of this (most?) looks like dev tools, test infrastructure, etc. What's the minimal set of angular dependencies needed for the client app to work?
Thanks!
Without resorting to Electron or Ionic2, is it possible (also, is it a good idea) to create the offline experience in Angular2 and then only manually include the resulting transpiled .js files in my Visual Studio project?
Yes, it is possible. TypeScript will be compiled to javascript codes, which will be consumed by your project. So eventually, it is compiled js codes that will be necessary for your project.
But, if you are so worried about your project's size, then I suggest you using Angular 1, which is only JS codes. And for the minimum size of Angular 1 and its dependency jquery. There is a compressed version of Angular 1 (angular.min.js: 164kb) and jquery(jquery-3.1.1.min.js: 85kb).
Answering my own question here:
Yes, it's possible. You can copy over the transpiled .js files and then simply point the webview control at the generated index.html. With that being said, it's a pretty kludgy dev experience since you're constantly working around VS.
The dependencies are handled for you - it's all in the minified/uglified js files.
I haven't investigated tree-shaking yet, but it looks like I can get away with ~0.5Mb with a skeleton project.
I am beginning to use Go for web development, but I am having issues with asset management. I would prefer to have a tool like Rails' Asset Pipeline for managing (and compressing) css/js files (as well as SASS), but I am still able to work with css and js files.
While I am able to work with css and js, I am not able to work with SASS. Is there a way to use SASS in a Golang project? I am not using a framework.
Thank you!
I'm not familiar with Ruby on Rails but, I assume, that ruby on rails gave you some sort of tools for managing the source to distribution client-side asset transition (polyfills, transpiling, minification, compiling of SASS/SCSS to CSS, compiling of XScript to JavaScript ... etc).
While a web development framework might do that to try and ease in developers quickly (I assume rails does that, not ruby) its not exactly the way Go does stuff.
Go is a language, not a framework + language, just a compiler, a few build tools and a set of standards for how to write, test, document and indent stuff (with the indent,test and document part being optional).
A go server, at least the way I built servers with go, is somewhat decoupled from the client. It server static assets when they are needed (e.g. it serves the minified JavaScript and the stylsheets and the html, and jsons with info from the databases... etc), but it doesn't really care about what those are, its a server. The go toolchain is made for building golang applications (e.g. said server), but its not made for building client-side web applications (those consisting of js, css and html).
Now, you may use a framework similar to rails written in go that helps "pack up" css, js, html. But I'm unaware if there are any.
You may use a compiler which turns go into client-side code (i.e. javascript) https://github.com/gopherjs/gopherjs , if you enjoy the go toolchian and want to use it for client-side development. But, go-like performance isn't something this gives you AND you are working with a subset of go. Its really just a different way to write javascript.
However, what you most likely need in your case is a "build-chain" for your client side. Here there are 3 tools which (in my opinion) stand out in 2016:
npm
webpack
bower
I could write an essay about using this tools but here's the summary:
Webpack is used to create a "pipeline" for your code which does thing like, calling babel on javascript, compiling sass to css, minifying assets, allowing js to be written with import syntax... etc, really, its a swis army knife in your js development arsenal and probably matches the functionality of whatever you were using before.
Npm is the node package manager BUT even if you are not using node for your server. It can be useful to keep tracks of dependencies for building your application (like webpack) and for downloading modules. Its also useful for running various scripts and deployment, its a bit of an overkill to use both npm and weback though you will probably have an easier time setting up the webpack enviornment if you have a package.json (config file for npm) with each of your project.
Bower is one I actually don't use for small projects. But its basically a repository for javascript libraries (among other things), so you can easily say, write "bower install jquery" and you've downloaded jQuery for your current project.
Again, there are many other tools out there, these are just some of the ones I like, but, check some of them out. They can help you replaces your previous pipeline. Don't think of client and server side code as being the same, they are decoupled and having a strong separation between them might help you a lot.
background
I have designed many tools in the past year or so that is designed to help me program for XPages. These tools include primarily helper java classes, extended logging (making use of OpenLogger and my own stuff), and a few other things that I personally feel I cannot work without. It has been discussed with my employer, and we feel that it might be a good idea to start publishing these items to openNTF. Since these tools are made up of about 3 .nsfs, all designed to use the same java code, key javascript classes, css, and even a custom control or two, I would like to consolidate key items into a plug-in that can be installed at the server and client level. I want to do this consolidation before I even think about publishing any of the work I've done so far. It would just be far too much work to maintain, not just for me, but for potential users. I have not really found any information on how to do such a thing in google searches. I also have to make sure that I am able to make use of the ExtLib libraries, openNTF Domino API, and the Notes API.
my questions
How does one best go about designing such plug-ins? Must a designer
use eclipse, or is this it possible to do this directly in the Notes
Designer?
How does a designer best go about keeping a server and client up to date while designing and updating the plug-in code? Is this why GitHub is often used?
Where is the best place to get material to get started in this direction? I sort of feel lost in the woods, knowing I need to head north, but not having a compass for that first step.
Thank you very much for your input.
In my experience, I found that diving into plug-in development is a huge PITA until you get used to it, but it's definitely worth it overall.
As for whether you can use Designer for plugin development: yes, but you will likely eventually want to not do so. I started out by using Designer for this sort of thing for a while, presumably with the same sentiment as you: why bother installing another instance of Eclipse when I'm already sitting in one all day? However, between Designer's age (it's roughly equivalent to, I think, Eclipse 3.4), oddities when it comes to working sets between the "Applications" and "Project Explorer" views, and, in my case, my desire to use a Mac app, I ended up switching.
There are two major starting points: the XSP Starter Kit (http://www.openntf.org/internal/home.nsf/project.xsp?name=XSP%20Starter%20Kit) and Niklas Heidloff's video on setting up Eclipse for XPages development (http://www.openntf.org/main.nsf/blog.xsp?permaLink=NHEF-8RVB5H). The latter mentions the XPages SDK (http://www.openntf.org/internal/home.nsf/project.xsp?name=XPages%20SDK%20for%20Eclipse%20RCP), which is also useful. In my setup, I found the video largely useful, but some aspects either difficult to find (IBM's downloads are shifting sands) or optional (debugging, which will depend on whether or not you're using Eclipse on Windows).
Those resources should generally get you set up. The main thing to worry about when setting up your Eclipse environment will be making sure your Plug-In Execution Environment is properly done. If you're following the SDK setup instructions, that SHOULD get you where you need to be.
The next thing to know about is the way plugins are structured. Each plugin you want to install in Designer or Domino will also be paired with a feature project (a feature can house several plugins), and potentially an update site - the last one is optional if you just want to import the features into an Update Site NSF. That's how I often do my normal plugin development: export the paired feature to a directory and then import the feature into the server's Update Site NSF and then install in Designer from there using Application -> Install. You can also set things up so that you deploy into the server's plugin/feature directories instead of taking the step of installing into an update site if you'd prefer. GitHub doesn't really come into play for this aspect - it's more about sharing/collaborating with your code and also having a remote storage location for your git repositories (which I highly advise).
And as for the "lost in the woods" feeling: yep, you'll have that for a good while. There are lots of moving parts and esoteric concepts to get a hold of all at once. If you mostly follow the above links and then start with some basics from the XSP Starter Kit (which is itself a plugin project that you can pair with a feature) - say, printing text in the Activator class and making an implicit global variable just to make sure it works - that should help get your feet wet.
It's best done in Eclipse. You can debug your code running on the server from there, as well as run it directly from there. The editors are also more up-to-date. You want:
Eclipse for RCP and RAP developers
XPages SDK for Eclipse RCP (from OpenNTF)
XPages Debug Plugin (from OpenNTF - basically allows you to load the plugins to the Domino server dynamically, rather than exporting to an Update Site all the time)
XSP Starter Kit on OpenNTF is a good starting point for a plugin. There are various references to the library id, which has to be unique for your plugin. Basically, references to org.openntf.xsp.starter need changing to whatever you want to call your plugin. You're also best advised to remove what you don't need. I tend to work in a copy of the Starter, remove stuff, build and if there are errors with required classes (Activator.java obviously will be required and some others), then paste them back in from the Starter.
XPages OpenLog Logger is a good cross-reference, that was built from XPages Starter Kit. It's pretty much stripped down and you'll be able to see what had to be changed. A lot of the elements of the XSP Starter Kit correspond to Java classes you'll probably be familiar with from your XPages Java development.
GitHub etc tend to be used as source control, which is useful for working out what's changed from time to time.
So I am very interested in using LESS with Bootstrap and Visual Studio. THe problem I'm having is that Web Essentials doesn't seem to be able to compile css from the Bootstrap LESS files. I've done some poking around and it seems that Web Essentials doesn't understand semicolons or something to that effect, which is causing it to choke on bootstrap's less files.
So, are people using LESS with bootstrap in a VS environment, or have I wandered onto the fringe?
Some tools you could use:
Web Essentials - I can tell you it does work with Bootstrap as I've used it before
Web Workbench - A paid alternative, I prefer web essentials
GruntJS - A JavaScript task runner that you can configure to build various resources and hook it up to your post-compile step so it happens automatically
Personally I'd go with grunt, while it's not very commonly used tool in '.NET', once you've used it you can see the awesome power it gives you. It's open source, and has a tonne of open source plugins that lets you do heaps of stuff, plus you can write your own.
Some examples of plugins: minify JavaScript; compile SASS, LESS, TypeScript, CoffeeScript, Markdown, etc.; copy files; delete files; optimize images and so on.
Check out WebEssentials (as you've already found, if it doesn't work, try filing a request or an issue) or the Mindscape Web Workbench and finally the BundleTransformer. Your request isn't a fringe, the web is embracing these technologies, so is Visual Studio.
If you'd share the exact messages you're seeing, or the steps you've taken so that we can reproduce, we can help you better. As far as I can tell WebEssentials should work with Bootstrap's less files just fine.
Question
If you've used RequireJS with a Rails 3 (esp 3.1) app, how is that working for you? Any configuration tricks or other gotchas that I need to watch out for?
Background
I'm contemplating using RequireJS over the Sprockets-based Asset Pipeline in Rails 3.1, specifically for JavaScript code. I have two motivators for this choice:
I want to leverage RequireJS' module management for my JS client-side code.
I'd like a precompilation system that can follow my JS library code into other contexts. To my surprise, the Asset Pipeline precompiler is a baked-in part of Rails, not a part of Sprockets itself.
All feedback appreciated, thanks!
For posterity, here's where I've come to on this question:
RequireJS provides an implementation of the Asynchronous Module Definition API. RequireJS' Why AMD? page lays out the case as to why you'd want to use this.
Sprockets and the Rails 3 Asset Pipeline allow for simple structuring of JavaScript/CoffeeScript code, but don't provide any true module support. For example, there's no namespace control whatsoever in Sprockets.
jQuery (as of 1.7), Underscore, Dojo and numerous other major libraries have implemented AMD support. Several other major JS libraries seem to have AMD support on the near-term horizion (e.g. Backbone.js).
It's certainly possible to create a Rails app that integrates RequireJS. To simplify that process, I've created the requirejs-rails gem on github, with straightforward configuration and Asset Pipeline-aware precompilation for AMD-based code via r.js. The current release is available via:
gem install requirejs-rails