An HTML 5 only Business-Oriented application - html

I am planning to create a HTML5 web application. I have a couple of queries though-:
I wished to know if it is possible to create a business oriented application using HTML5 only without a backbone like Asp.Net. I found a lot of articles on google suggesting the use of Asp.Net MVC, or ASP.Net website as a base template but none suggesting a HTML+js alone approach.
Given the web standards update for VS 2010 SP1 and js libraries like Modernizr, is it possible to create an app completely in HTML5 using Visual Studio.

You're eventually going to want to do some server side work, and for that you would need either Java, PHP, or ASP set up to intercept and process commands... you could go ahead and create everything in HTML+JS alone, and use the file writer for "permanent storage" but that's really cutting corners, and can lead to catastrophe down the line depending on where exactly you are trying to take this application of yours.

Related

Do HTML5 development using grunt and bower with WebSite project or create HTML5 Web app in Visual Studio 2015?

I want to build a custom PURE HTML5 Web Template, for HTML5/CSS3/JavaScript single page application development, and then use that as a starting place for SPA HTML5 web development.
Microsoft clearly recommends using Web Applications, but provides NO pure HTML5 web application template, thus this task is left to end users.
I am not asking if I should use an ASP.NET Web Site or ASP.NET Web Application instead I am asking, what template configuration can I arrange that will let me use the most modern HTML5 tools and workflows, and is it the Web Application (with .csproj or .xproj project file) or Web Site project (a folder based project)?
For projects where a developer needs to build a pure HTML5 SPA, maybe with ExtJS or maybe with Angular, or something equivalent, the first choice made is between File-> New Web Site and File -> New Web Application.
If it may be that later my HTML5 project may get some ASP.NET added later, it is clear I should choose File -> New Web application, but there is NO HTML5 template provided, so I am looking to build my own Template and use that. But what should it be based on?
For the WebSite option, you click file New Web Site, and you get a folder-based project, but none of the new grunt/bower support.
I am looking for a way to get the best of both choices. Can I get grunt/bower support if I click File New WebSite? Or can I do pure HTML5 work somehow if I click File New Project?
It is possible to crib a pure HTML5 Web Development .csproj + .sln project together myself, starting with some examples that used to be on codeplex and are now on GitHub
It seems to me that the benefits of a .csproj or .xproj based root for pure HTML5 development are:
I can specify only the files I want to see in my project explorer.
I can easily add ASP.NET webapi controllers to my "pure" project without rebuilding the project.
Can I use one of the ASP.NET 5 (DNX) Web Application templates (.xproj), and just delete all the C# stuff, to get a working pure HTML5 development template, and retain all the new javascript grunt/bower tooling? Or do I have to stick with Web Site (folder level) projects, and their visual studio 2005 era website development features, for pure HTML5 html/css/javascript development?
Update: If close voters who voted "opinion" based would be so kind enough as to point out where I call for any opinion, that'd be great. I'm asking for help DEVELOPING a template for Visual Studio, and I believe that is on topic and not at all a call for opinion. To develop a template you must make a choice. Which one will provide the most complete HTML5 tooling including grunt and bower and full javascript syntax highlighting, jslint, bundle, minify, etc?
When developing a template, my research so far shows that:
Patience, grasshopper, it's early days. ASP.NET Core 1.0 just released, but does not include certain elements, including a new .xproj style set of projects for basic pure HTML 5 web project development (name not yet even announced, but let's hypothesize, it might be called Core Pages), whatever it is, the Microsoft "franchise reboot" for Pure HTML5 Development with Microsoft Visual studio either doesn't exist yet, or is in early stages of internal development. Whatever template I could make today might be obsolete in three weeks or three months if Microsoft makes a move here.
For now, for people who can live with it, File -> New Web sites works fine, and I haven't found any technical documented reason why you CAN'T use it for new development, just a caution from Microsoft that it might not be the best choice, if a File -> New Project template can meet your needs. You can see from the way that ASP.NET Core 1.0 today works (just in time automatic-recompile without rebuilding in ASP.NET Core brings a core feature of the WebSite world over into the WebApp world at last) that its new tooling and the new .NET Core features inside dnx and dnvm will finally "restore the Balance of Nature" that I feel has now been divided over the last 10 years by the WebSite/WebApp dichotomy. Not yet, but that's part of the core design elements I have understood from studying the ASP.NET Core architecture.
For ExtJS, the Sencha Ext JS plugin for Visual Studio provides a File -> New Web Site option, and this works fine. I downloaded and tested it yesterday evening and it works fine. If I want to invoke grunt or bower, or bundle and minify, or any other web-dev workflow task, I can do so manually using an external command prompt window as well. So while it might not be as shiny as I was looking for, it's possible to get work done. The Ext JS plugin provides full Ext class hierarchy code-completion, and starter templates for both pure HTML5 (via file New Website) and HTML5+ASP.NET (via File New Project). When evaluating their plugin I initially thought there was NO way to do a pure HTML5 app inside visual studio because I was totally unaware of the File New Website option, and thought (incorrectly) of this area of VS as deprecated.
For Angular SPA development INCLUDING .NET there is this template, and it appears you could use it and just not write any ASP.NET server side stuff if you wanted to do a pure HTML5 SPA.
I would probably suggest starting with the angular SP development template linked above and modifying it to subtract angular and insert ExtJS, or using the ASP.NET 4.6 plus ExtJS template provided by Sencha's IDE plugin, and just subtracting all the ASP.NET code from that template. I don't yet have a starter template suggestion for the ASP.NET Core 1.0 .xproj world yet.
It should be possible, and seems quite easy to use .NET Core and ASP.NET Core as a key part of the tooling for a pure HTML5 development environment. In particular "dnx web" is a useful way of locally developing, as it is even more lightweight than using IIS Express. It should be equally feasible to develop for HTML5 with "DNX web" (kestrel) as the lightweight static server for pure HTML5, and either a full Visual Studio 2015 project (either website or webapp), or using just a modern web-editor like Visual Studio Code.
I hope that other developers who are still confused, as I was about the now-10-years-long split-personality issue in visual Studio with regards to New Web Site and New Web Application, may finally see some light at the end of the tunnel.
Update: Q4/2016: It actually looks like the two way split personality issues in VS 2015 will get worse in VS 2016 (Currently in preview as VS15) because there will be THREE ways to open a project, open solution/csproj via one menu item, open web project via another, and open folder via a third.

Going from webpage to website

I have been coding html/css for some time now, and I've gotten to be proficient at coding single webpages, but I can't figure out how to code a website. Some questions I have are:
Do I need to buy a domain if I want to build a website (for practice)
Are their special things I need to know (such as special tags) that I wouldn't have learned from coding just a single page?
Should I learn how to use a grid if I am coding multiple pages?
You may want to first decide what kind of back end you want (the server side code that builds and delivers the pages) I strongly recommend rails, and a react.rb.
You do not need a domain name.
A great way to start is to use a service like cloud9 which is free, and will get you going in no time. Cloud9 will do a one button setup of a rails environment and get you going.
Another approach is to begin using react.rb and just expand your skill set from the front end towards the server. The react.rb tutorial creates a simple chat application and you can do this all with the tools your already have. Once you have mastered that you can set up a simple rails server and start adding server side persistance (saving data on the server.) This is the approach I recommend, but full discloure: I am one of the leads on the react.rb project so I am very biased.
Well, you can build simple to wonderful STATIC websites from HTML/CSS but if you are talking about some serious web development then you will need to learn a server side scripting language. Most of the websites these days are database driven serverside webpages. There are many serverside programming languages and tutorials for the same out there.
I suggest you start with PHP (for scripting language) and MySql (for database)
Again, the choice of language is totally upto you.
Then you would need to learn about setting up a server on your local computer. For this you will need to learn about (x)-AMP. This would be WAMP, XAMP, MAMP depending on what OS you are using.
If you are only needing to develop a simple CMS website, then there are alot of CMS framework which you can go for, which will not require much of coding.
It seems as if you are looking to connect multiple pages to the same website, so you can navigate between pages. And it seems that you want to practice with local files. If that is the case, you need to first create a local folder for your website and use the a tag in your html files. Inside the a tag, you will need to include an href with the url to your other page. A link to another html page that is saved in the same folder as your original will look like this:
New Page
You will want to use external CSS and JavaScript files to keep all of your pages in the same format.
http://www.w3schools.com/html/html_links.asp
http://www.w3schools.com/tags/tag_link.asp

How to integrate WebSockets on top of a classic ASP web application?

In one of my projects, I have a very active classic ASP site with a requirement to integrate live event-based feeds as part of the existing UI. There is a plan to upgrade the site architecture to either MVC or MVP in the future, but this new feature must be implemented in the meanwhile.
I have decided to go with a WebSocket approach for this, as this is ultimately what we will want to use in the future, and rebuilding this doesn't make sense. The question is, how to integrate this with the classic ASP "architecture"?
The site already implements the jQuery library, and was hoping to leverage jQuery's capabilities to create those streamed sections on a given page.
The current req's ask for this news feed to exist on every page. Thus, loading a new page will re-render the news feed, and should kick of from where it left on the last page. For this, I'm guessing a position indicator will need to be read (session variable I'm guessing).
Anyhow, those are the requirements. I was thinking of wrapping the the entire existing classic ASP site inside a MVC or MVP (C#/.Net) project to allow us to begin swapping out legacy features as they are developed, such as this one.
I would like to get some advice on some recommended approaches for this scenario.
Thanks.
I would do a SignalR app and integrate it in you old app.
It's easy to integrate ASP classic with ASP.net MVC. Just mix the projects and exclude *.asp from the routes
routes.IgnoreRoute("{resource}.asp/{*pathInfo}");
You will have some trouble in the root (/), but you can sort it with a redirect.
For a mixed authentication (if you need it) you will need to write your own authentication in MVC to use the same auth cookie that you use in Classic ASP. I've done this in the past with success.

Delphi with HTML/CSS interface

I want to develop a delphi application with an HTML/CSS graphical user interface, not necessarily running from within a web browser. I want to do this do create a richer graphical user interface with animations etc. and break away from normal VCL components / Windows look. Any suggestions?
HTML and CSS won't deliver animations or a Rich User Interface to your feet. Far from it in fact. Quite the opposite. You will need to invest in a toolkit to provide that sort of functionality and almost certainly involve JavaScript. And even if you don't want your eventual application hosted in a web browser, your application will itself have to host a web browser to render your HTML/CSS/JavaScript UI, and you will then have a much more difficult job of connecting your GUI to your application logic (unless you do actually embrace a web application architecture).
Delphi (or any Windows application development language for that matter) gets you much, much further down the road towards a more simply, effectively and quickly implemented Rich User Interface than HTML or CSS.
If you don't like the look and feel of the standard Delphi controls (which in essence is what you are saying) there are numerous alternative libraries available.
Also bear in mind however that when someone uses a Windows application they expect it to look and behave a certain way to a large extent. Using fancy, web based paradigm's in a desktop application simply for the sake of it is likely to confuse and frustrate users if taken too far.
I'm all for user interfaces breaking with convention where it leads to a more intuitive user interface, but simply being "prettier" does not necessarily lead in that direction and is just as misguided as dogmatically adhering to convention.
In one of my applications I have an an embedded browser and I have implemented the IDocHostUIHandler interface. This allows me to expose a COM object via the "GetExternal" method. I simply have a COM object that exposes methods and properties of my application which makes them available to the web pages hosted inside the embedded browser.
So the script in my web pages has lines like "external.DoSomething()" and "i=external.GetThisValue()". So, for example, behind button onclick events you can run a method of your application (implement in the main form, in the COM object itself, or whatever you like).
This site has lots of info on embedding a browser in your Delphi app:
http://www.delphidabbler.com/articles?article=22
It can certainly be cumbersome to implement a lot of this stuff and in many cases there are probably better options. But for my specific purpose I am able to offer a "home page" which can easily be modified to change its layout, look and even expose more (or less) functionality as required by myself or my users.
If you want a Delphi program with a better-looking interface, HTML is really not what you're looking for. What you really need are better-looking VCL controls.
Take a look at TMS Smooth Controls, for example. If you're on Delphi 2009 or 2010, you can get it as a free download here. That's one of many component libraries that can bring a slicker user interface to your program.
HTML / CSS offers some nice features which are (not yet?) available in Delphi and the VCL. They are also a good starting point for client/server programming, separating the user interface and the business logic is a key factor here.
One popular library for Delphi is the extpascal project:
ExtPascal is an Object Pascal (Delphi,
FreePascal/Lazarus) wrapper/binding
for Ext JS, a complete GUI Ajax
framework, made in JavaScript, for
Rich Internet Application (RIA)
development. ExtPascal lets you use
Ext JS from Object Pascal commands
issued by the server. It brings the
structure and strict syntax of the
Object Pascal for programming the web
browser. ExtPascal will wrap Draw2d
into future releases.
Some demos are online here and here.
p.s. and I really like the HTML / CSS support for element and font sizes in relative units (for exampe percent). Combined with browser zoom in / zoom out and WCAG, user interface ergonomy can not be much better.
HTML Option 1
If you relly want to use HTML+CSS(+JavaScript) to build a GUI, you can have a look at HTML Applications, a very fascinating concept from Microsoft. HTML Applications, .hta files, have been supported from Windows ME, if I remember correctly, and they are still supported on Windows 7.
You could create an HTML Application (i.e. an HTA file), and by so doing, creating a GUI using only HTML, CSS, and JavaScript. When the user double-clicks the HTA file, it will open like a program, but the GUI is entirely based on HTML; in fact, the entire Window is an Internet Explorer window in disguise.
And now comes the important part: you could create non-GUI Delphi applications (i.e., Delphi applications that are not console applications, but that have no forms either), and start them via hyperlinks (or JavaScript) from within your HTA GUI. (Well, it is probably better to create one such Delphi application, and use command-line arguments (ParamStrs) to communicate the desired action.)
Just an idea...
HTML Option 2
Alternatively, you could create a normal Delphi GUI application, but fill the entire main form with a TWebBrowser (a IE control), using Align := alClient. Then you could either load static HTML pages (stored in the Program Files folder or on the Internet), or you could use Delphi to dynamically create HTML pages to show. I think it is possible to intercept links from the control, so that you could respond to links using Delphi code.
What about OpenGL?
If you want to "break away" from the normal Windows look and feel, then I would recommend you to create your GUI using OpenGL. It is very easy to make a Delphi application with OpenGL (as long as you are familiar with OpenGL) - just add "OpenGL" to your uses list.
First this: I completely agree with Deltics' answer.
Having said that, if you master HTML and CSS (and JavaScript and AJAX etc etc) and you are looking for a way to use the power and speed of the Delphi compiler to run the dynamics of a website, this may be of interest.
I've created a project that uses the Delphi compiler to build a library that runs a website. The source-files combines HTML and Delphi, much like other web-scripting tools out there, but gets processed on a page-refresh, and compiled automatically. It uses a 'library handler' that plugs in the website library into pretty much anything you like: IIS, Apache, a stand-alone HTTP server (for hosting), or directly into InternetExplorer or FireFox (which is great for developing).
http://xxm.sourceforge.net/
New versions of Qt contain ability to use html/js for interfaces. I don't know if there is Qt library bindings for Delphi, but Qt is exactly what you want.
for Rich GUI and animation, have you looked at KSDev DXScen and VGScene ?
If you want to keep your delphi/Pascal Object 'background' and have a Web like RIA you also have a look to Morfik : link text

Jump-starting web development

I wrote a prototype for my software in Python as a desktop client-server program, but I want to do the real version as a web service. (I have seen the light? much better deployment and reduced cost) Trouble is, I don't know web development.
I already did something webdev-ish: I have a page with a form on it, that when submitted Apache will run my Python script, which will do some server-side tasks and then send the result on a new page back to the user. Its a very simple tool (doesn't use any DB or framework), but I suppose that's the basic idea of web-based services... I think. To me that was a workaround, I did not realize it is webdev-ish.
So I have a basic idea of how it works, and about 8 years of programming behind me, but I need to learn:
How to design web sites (XHTML and CSS?)
Javascript and AJAX
More advanced features of databases (Postgresql)
I'm thinking Python/Django is a safe bet.
Any suggestions on where to start? I'm not the type who has the patience to read a book; I would rather jump in and build something simple first, then bigger and bigger stuff, but I can't seem to get my head around learning web design - I still format everything with tables.
Cheers and thanks
Check out Django. Django is a high-level Python Web framework that encourages rapid development and clean, pragmatic design.
There will be a learning curve, but you might as well learn how to do it right the first time. Go through the documentation, and start building small Django applications. There are tutorials on the Django website.
And yes, you will have to learn HTML and CSS anyway.
Tables are not evil, by the way. You don't have to learn your first website with CSS, but you will need to learn correct CSS layout sooner rather than later. There are free CSS templates out there you can use, which makes the correct use of CSS much easier.
I only got slightly into Django, but I hear good things, so stick with it if you like the approach... inheritance & templating language
XHTML blocks just need to not overlap (markup container rule, good XML syntax with contained elements closing before new ones are begun). Honestly the simplest & most common approach to start web layout is PHP, so I suggest that as first alternative since it is so template-centric.
my favorite CMS is ZOPE, built and used with Python for scripting. Zope3 is more like Django, Zope2 I use more still (Python 2.4.x) has some internal syntaxes and methods to grapple with at first, but if you wish to try it I have a basic site editing framework.
the advantage is the object database hierarchy is just like site structure, inheritance of scripts, content objects (HTML chunks & contextual values), properties... so duplication is minimized, the whole site can be a simple template, reuse & extension maximized. navigation scripted, archive by month & listing contents scripted, footer once, sidebar inherited throughout site - override by cloning into subdirs and editing or specifying object/property for local instance closest to the URL path then seeking up to root.
users can have roles in sections, XML-RPC/HTTP/FTP all ZOPE methods including user-defined, so rich clients can workflow media effectively. batch process media uploads with default containers for each item and metadata (filename, type extension) so users get right to their details. ZOPE can host files or static, remote, whichever, so long as the app knows where to find them (one base property for the app or project root)
if you get into Django there is the ZODB standalone library part of ZOPE for persistent storage only, no ORB