A (possible) client has a multipart questionnaire that they want coded in HTML5 (for responsiveness). I was thinking Bootstrap 3, combined with HTML and a bit o' javascript. However, I don't know what their options are regarding tracking the answers.
I'm new to HTML5, coming from the Flash world. What are my options? It seems a job for a backend DB, and I know enough Django to get into trouble, so perhaps that would be the best bet? I have done basic Django sites, but when something goes wrong, oh, it's a bit of a pain! (I haven't found Django as user friendly as I might like)
Is there anything new and funky in HTML5 (I'm not sure how they'd get the data out of local storage)? I'm good at HTML, but don't know all the tricky tricks in HTML5.
Thanks
Use ViewModel with Knockout.js for responsiveness. Its pretty fast.
You can see this sample Knockout.js project here.
Have you taken a look at the Django HTML5 Boilerplate (DH5BP) project1 on GitHub?
From the Readme.md
The Django HTML5 Boilerplate...incorporat[es] the HTML5 Boilerplate (H5BP) project into an easy to consume Django-friendly Python package.
Find out...about HTML5 Boilerplate at https://github.com/h5bp/html5-boilerplate
This project differentiates itself from other H5BP to Django ports, by
including Fabric scripts that automatically convert new versions of
H5BP into a Django-friendly Python module. Ideally, this will make
keeping up-to-date with the latest version of H5BP trivial.
Your best bet is probably to work with a CMS. It would greatly reduce your development time and it would help you avoid common pit-falls.
I would recommend using WordPress with some sort of plugin as in my experience it has been the easiest to work with for small projects.
HTML5 has some new elements and a simplified syntax. Some elements have had their definitions changed (what the tags intended usage is).
Update:
Four years later, WordPress now has a REST API. A good way to store user input could be to check if they are logged in and then post information via AJAX to the API.
Related
I've mostly worked with Springboot framework only with JSP to cover the things I need for the website part. Now, I've got a project to do that mostly revolves, if not all, around the website and I have a couple of questions.
Just to be clear first, I don't have experience either with Thymeleaf or Angular so whichever I pick will be the first time (I think thymeleaf syntax would be easier for me to handle).
Ok so the main goal in my mind is not to render the whole page every time I load data from the backend, so I figure I would have like a header/content/footer parts where every time I click something only the content part would change. Also, I would like the possibility for a loader to show and go away when the content part is changing. This web application will need to be secure for users that register.
I've searched the web to investigate both frameworks, but can not seem to find the right answer so I can continue with my development
I do not mind creating separate REST services in later development if some other platform needs to hook up to the service if I decide to go with Thymeleaf.What do you guys think in what direction should I go, Thymeleaf or Angular? Any help and/or discussion would be much appreciated.
I am sorry if this seems like a general question, but I just need some basic guidelines to start with. Cheers!
I think transitioning to ThymeLeaf is probably going to be the easiest for you, but Angular is a great choice as well, and from there it is up to you. Would you rather use mostly expressions similar to JSTL expressions, but in Spring's SpEL language, then use ThymeLeaf, or would you rather use JavaScript, then use Angular. It just a user's preference for what you are doing.
The fragmenting portion (header, footer, body, etc..) is native to both frameworks. It just depends on which one you want to use. Whatever you go with, to load specific sections while not rendering the others, is going to require AJAX and for you to feel comfortable with how the template frameworks work.
I would suggest reading up on both of them to figure out which one you feel more comfortable with.
Angular
Thymeleaf
Both of them have great documentation for beginners and the Baeldung and Mkyong have good walkthrus for ThymeLeaf. Angular's documentation I found good enough on its own.
For a loader, you can do with simple CSS and JS. There is a ton of demos out there on how to do full screen loaders and how to turn them on or off with JS or CSS. IHateTomatoes has a good article about how to build a full screen loader, that has a No JS fallback option and should give you a good starting point.
Your point about it needing to be secure is a whole other monster. I would look into Spring Security. It's relatively straightforward, especially when using Spring Boot. If you want it can control the users session and assist in preventing session jacking, add CSRF to prevent cross site forgery, control permissions to urls and on down the line, or not. It all just depends.
Either way, don't randomly stab at security, it will end up in something that you feel is secure but it is not, which leaves you and your users in a very bad spot. Again, Baeldung has a great walkthru on the user registration and login process that can help get you started with Spring security and how to tie everything together.
Pretty high level answer, but hopefully gave you some good starting points and some resources.
Build apps decoupling frontend from the backend.
Always build apps following the "The API-first approach"
The API-first approach involves setting up the foundation of your app, which is the application programming interface
For me the differences between Thymeleaf and Angular:
Using Thymeleaf: You don't need to create Restful/web service endpoints on your frontend side because you just need to make calls to the backend from the frontend itself.
Using Angular: Besides of your Restful/ web service endpoints on your backend side, you have to build Restful/ web services endpoints on your frontend side because you don't want to expose direct access from Javascript code to the backend.
Hope this helps and happy coding time!
I want a javascript framework which has features like below:
MV*
Well structured
Html file as template
Rendering fast(maybe virtual dom?)
Combine and compatible with other plugins or libraries
Edit on tablet IDE apps and view in browser immediately by refreshing page after I changed code
When I am at home, I use PC to develop my client-side(or front-end) applications.
When go out, I use my tablet(I have no note PC), so I want to develop my applications outside.
*There are some excellent IDE apps on the Android Market.
Before I know Ember, I have been using pure javascript(jquery) + css + html to develop client-side application for daily practices or work.
But recently, when I began to learn EmberJS, a Javascript MVC framwork, I am lost.
It seems that EmberJS have to get its own server up to compile something, which generate static contents for browser rendering.
I just want to get my client-side code(files) rendering in the browser, but why I have to 'run' it as if I get apache started to serve as a php back-end.
I have googled hundreds of pages to find a solution, nothing expected result discovered.
Including Angular, backbone or any other popular Javascript MV* frameworks, they all must compile there applications.
Is there anyone who has encountered this situation?
Then any advice, please?
Increasingly most Javascript frameworks are shifting to doing a "compile step" as part of using them. This allows you to do a variety of changes to your Javascript files, which in turn makes it easier for you as a developer. An example of this is that you can use ES2015 classes and then have your compile step "transpile" them to older Javascript that will work in all browsers.
The side effect of this though is that you need to have npm running on your computer to be able to do this well.
If you really don't want to have the compile step, then I would suggest looking at VueJS. It's the only recent Javascript framework that allows working with simple non-compiled JS files. But you'all be missing out on some of the best changes to Javascript as a result (ES2015 has made life much better)
Finally, I found a nice solution(framework) that is Durandal.
Really, pure HTML+Javascript without built and server up(anyhow, a web server needed if I wanted to publish it in my hosted web server).
.html extension and designer friendly.
I can upload its source files directly in to S3 and browse the html pages.
Just found some nice examples with well structured project on github is here.
And I can work smoothly with my dear designer friends.
Though its next generation Aurelia will also be built and serve it up like Ember or others, but the current generation is enough for me.
Hope those one got help from this;)
So I started working this year after finished studying last year. I have been exposed to so many things in the working environment. Suck as Maven, GWT and Hibernate.
Now I got this side project in which I just need to create a simple website which would bassically just display some information and contacting details.
So I was wondering if HTML5 CSS and JavaScript is still the way to go and if there are not powerfull frameworks in which could you help me do animations and graphics much easier.
Also if you know GWT and GXT would it be a bad idea to create a visually apealing website using these frameworks.
Thank you so much for reading
Have a nice day
Objective: Create a simple website which would basically just display some information and contacting details.
GXT:
GXT is built on GWT.
Go for GXT when you are in need of rich set of widgets (it is a very large set of collection) out of the box. Have a look on the following link where GXT has showcased the different widgets
http://examples.sencha.com/gxt/4.0.0/
GWT:
GWT will be having minimal set of widgets when compared to GXT. Have a look on the different widgets which are provided out of the box. http://samples.gwtproject.org/samples/Showcase/Showcase.html
Javascript Animation framework:
There are bunch of javascript libraries/frameworks for animation, choose one which is most appropriate to your work. Have a look on the following link.
https://www.javascripting.com/animation/
Conclusion:
Consider the following before finalizing on a framework
Framework which is having more out of the box components which matches the requirement.
Framework which is more stable
Framework which is having more support on the internet, such as forums, blogs.
Happy Coding!!
Question background:
Hello everyone, I have been developing windows form application for my employer for about 3 years. Though most of my works are amateurish. I've been using visual studio, c#, enjoying creating re-usable windows form controls by sub-classing and other techniques. Now my boss want me to make website for this company, the first thinking in my mind is to create re-usable WEB controls just like windors form application.
The methods I have tried
Web User Control, At very first, I found visual studio support developer to create Web User Control, with file extension as *.ascx. I was very exciting to find this because I thought I can create Web controls just like I did in windows form application development. BUT, it's a very big "BUT", I then found that it cannot be embed to assembly file (DLL), and either can it be displayed in ToolBox to support drag and drop in web page design time. AFAIK from msdn, the Web User Control is not intended to be re-used across projects. So I give up this method.
Server Control, then I found there is Custom Server Control can be created to support assembly embed and ToolBox. It's a *.cs file that written with a class which sub-classing from System.Web.UI.WebControls.WebControl or System.Web.UI.WebControls.CompositeControl. Good point is that this is exactly what I want: re-usability and design-time support. HOWEVER, the huge disadvantage is that it doesn't support drag-drop when creating the web control itself. The control can only be rendered by html written in c# or be created by code. And I have to embed css/javascript to the control if I want to create more beautiful, complicated or efficient control. Anyway, from MSDN, Server Control is what I need.
Pure HTML, Javascript (jQuery), CSS, actually I've beening working with Server Control method for a while, just in order to make my boss happy. But I still cannot stop thinking about other better solutions. From my understanding, web page is not that complicated, it's simply constructed (please correct me if I'm wrong) by HTML tag, javascript (or other scripting language), CSS to manipulate UI. So I believe if I create web control by pure Html, Javascript and CSS, it will be of course more complicated but more compatible. Because Server Control solution requires the web server support .Net Framework, which is not free and limited to Microsoft scope. If I have a way to get rid of .Net, why NOT? I'm willing to spend double-time to create Re-Usable control if it's worthy to do. For example, if I want to turn to PHP to create web page, I might have to acquire the technique to create my web control simply by HTML, Javascript and CSS.
My question
Speaking all of the above, is it even possible to create my web control library only based on Html, Javascript and CSS?
If so, is there any tutorial about this method?
I really would like to know that how does commercial/professional company create web page.
Thank you everyone, any advice will be very much appreciated!
Speaking all of the above, is it even possible to create my web control library only based on Html, Javascript and CSS?
In strict speak, the controls you have become accustomed to support the aforementioned. This will continue work in future projects created in WebForms.
However, if you foray into MVC then there is a striking difference. Most of the controls that handle input are client side (which can be wrapped in js wigets and user validation classes). On the other hand there is very little server controls, however there are _MasterLayouts and Views that can make use of PartialViews a PartialView is similar to a Web User Control. In your Controller you can return EditTemplates and other types that would be similar to Server Controls
After digging for a few days, I almost give up creating my own javascript library not just only for web widget(UI), neither I would like to use third-part js frameworks because:
Cost too much time: as it says: 'do not reinvent the wheel', well, I accept/disagree with this point half by half. But now, I simply do not have too much time on it. It really really cost time, can hardly complish by an individual person.
A lot javascript frameworks are so great, like dojo, yui, jqui, as #dandavis commented, BUT, the usage of some is difficult, at least for me (as a js beginner), especially dojo. Dojo is very powerful, AFAIK, but it's hard to implement and use. I followed official tutorial to create my own web widget, spend a hour and not get it done. I might give up too fast?
I still want to dig asp.net with ajax, it is much powerful. And can easily manipulate on server side.
Well, I don't know if it's an answer but this is my personal end of my question. Thanks a lot guys.
I have been searching for an answer to this problem now for several weeks. I also previously tried to research this a few years ago to no avail.
Problem Summary:
My company has developed a web-based data analytics suite for a major beverage distributor. They have recently asked for a feature that allows the user to print or download a visually pleasing version of the rendered app as a PDF. I have had no luck in finding a solid, controllable, or reliable method to do this. I was hoping the stack community might be able to point me in the right direction.
Current Tech Stack:
Plack servers
Perl base on the Dancer framework
Standard web dev front-ends: HTML5, CSS3, Javascript, Jquery/UI
Client is using IE9/10 and Chrome.
Attempted Solutions Summary:
Obviously I started with the window.print() and tried to control what printed using classes and a specialized print.css but the output was still awful.
I looked in to pdfmachine and pdfbox and even contacted Adobe's acrobat development team directly to see if they had an out of the box solution our company could purchase. I was informed that such a product would be counter intuitive to their desired business model of putting an acrobat subscription on each client computer rather than a single server side application.
I have extensively searched the stack articles but did not feel that the articles I found covered what I was looking for.
At present, I am all out of ideas and am hoping somebody out there has had better luck at this than I have.
tl;dr = I need a pdf version of the rendered output of a complex reporting app.
Thanks for your time stack, I appreciate it.
A solution I have used in the past is to use PhantomJS running on a server to generate the PDF for download/email. Usually if the content is sensitive the server (that handles authentication) would provide a single use viewing token that is then passed to a PhantomJS process. It loads the URL with the viewing token then saves as a PDF.
Further info on Phantoms screen cap API can be found here on GitHub.
https://github.com/ariya/phantomjs/wiki/Screen-Capture
Is it something you can create in Perl using PDF::API2 or PDF::Create? You can load and modify and existing PDF (handy if you want standard headers and footers), and then insert the relevant content. The learning curve can be a bit steep, but simple reports should be easy enough.
See PDF::TextBlock and PDF::Table too - they are great little helpers.
Consider this service http://pdfmyurl.com/ . I try to use many perl modules, but they dont satisfy my problems.