css or javascript framework used by websites - javascript

How to know which css and javascript framework is used by a website.
Does websites hide it.
Could not get any information on framework on checking the page source of website or web developer tool

A website http://builtwith.com/ should give an answer to your questions - it'll also give you a good overview of statistics and usage.
Besides, using the tool you can explore more interesting and useful information about technologies, tools and frameworks that are being used.

Related

showing interactive visualizations on personal website

I have several interactive/animated visualization projects (social network analysis, animated GIS, etc) that I would like to showcase in my website. I would love to build a website like this one https://kateto.net/network-visualization (see 6.2 Interactive JS visualization with visNetwork). Does anyone know where should I start?
Very limited experience with HTML coding and website building so would love to use some website builder tools such as Squarespace or wix, etc. Of course they need to be friendly with a lot of javascript/widgets. Will appreciate your recommendation!
In the same website example you provided, they explained that they are using visNetwork (the r package) & vis.js (used for the visualization).
I highly doubt that website builders such as wix/squarespare/etc would be able to import said libs.
I would recommend just learning web development and make a personal site for your showcase. It'd be a lengthy process however in the long run it'll be worth it.

SEO and AngularJS

I am building a web application with Angular JS, I need this to be fully SEO-optimized.
It seems that for a few, google is able to crawl angular app but it is not clear if it can read everything (eg I read that directives cannot be interpreted).
So today, is an angular app fully google-compatible even if we use the full set of JS functions? What about other engines? Do we still need fantomJS static generation for Yahoo or microsoft?
As of today, AngularJS is still not fully SEO-optimized. Thus, a lot of developers still find it necessary to use services like Predender.io or cooking up their own implementation by using PhantomJS
Great strides have been made towards SEO-friendliness, especially when talking about AngularJS 2.0 since it allows you to render HTML on the server side (More info here).
However, even with the new additions it's better to retain control over what the search engines are seeing by creating pre-rendered versions of your site.
Here is a great article about this very topic: https://builtvisible.com/javascript-framework-seo/
To quote some parts of it:
Google can render and crawl JS sites. This, however is no guarantee that the outcome will be an SEO friendly, perfectly optimised site! Technical SEO expertise is needed, especially during testing. This will ensure that you have an SEO friendly site architecture, targeting the right keywords. A site that continues to rank despite the changes made in Google’s crawl.
In my opinion, it’s better to retain tighter control of what’s being rendered by serving Google a pre-rendered, flat version of your site. This way, all the classic rules of SEO apply and it should be easier to detect and diagnose potential SEO issues during testing.
As far as other search engines, it seems like they currently don't support javascript rendering yet: https://www.bing.com/webmaster/help/webmaster-guidelines-30fba23a
The technology used on your website can sometimes prevent Bingbot from being able to find your content. Rich media (Flash, JavaScript, etc.) can lead to Bing not being able to crawl through navigation, or not see content embedded in a webpage. To avoid any issue, you should consider implementing a down-level experience which includes the same content elements and links as your rich version does. This will allow anyone (Bingbot) without rich media enabled to see and interact with your website.

Building websites using JavaScript frameworks

I have learned and can read/write code in JavaScript. I am a backend engineer by profession and want to learn how to build websites. I have gone to the point where I can build wireframes and start writing basic HTML. I've never succeeded in creating a complete webpage, because they always looked awful midway through.
I've seen many JavaScript frameworks (like Bootstrap, Backbone.js, and others) that one can use to create websites.
Which framework(s), if any, should I use? Which would you recommend I use to start building websites (and why, if applicable)?
I wouldn't recommend you using a JavaScript-framework to build your entire website. I would only recommend JavaScript to enhance your website with cool features.
I'm not sure what type of website we're talking about, but if you're planning on getting traffic from search engines — think twice.
Google aren't that good at reading content embedded in JavaScript. Meaning: your SEO will be terrible if you choose to build the website entirely in JavaScript.
HTML/CSS is easy, man. I'm sure you'll be able to learn that in a one day — tops! You're a backend engineer by profession for gods sake, HTML can't possibly be that hard to get a grasp of :)
I was in your exact shoes not so long ago - I'm a programmer and had no issues picking up the backend programming that is required of websites, but when designing the web page is something I just could not do. I would end up with terrible looking web pages which was very discouraging.
One great way to get around this is use HTML/CSS templates - there are plenty free ones available. Download one you like, then go through the CSS and change as much of it as you need to personalise your site. This process will also give you a great understanding of how CSS works, and how it should be used to design a page.
After doing this a couple of times, you will be confident/able enough to design a webpage from scratch. If not, continue using the templates. No harm in that.
As others have already mentioned, for a powerful, dynamic website you will need a server side language as well. Javascript frameworks like jQuery are nice for the front-end for the website. For the back-end you can try CakePHP, CodeIgniter etc., or just code the back-end from scratch. Doesn't seem that would be a problem for you.
Some sites that provide free HTML/CSS templates:
CSS Creme
FreeTemplatesOnline
Most of them are optimized for 1024x768 which might seem a little outdated for a few. Try tweaking the CSS code to make the template suitable for your purposes - change images, width etc.
You can't exactly build a website using JavaScript. You could, but that would be very inefficient...I recommend going through some HTML tutorials, as you (and the websites you build in the future) will benefit a lot from the fact that you use HTML primarily, and enhance it with JavaScript. After all, JavaScript can't do much in comparison to HTML (since in order to build a site with JavaScript (or my interpretation of what that is), you need to have a basic understanding of HTML).
Unless I misunderstood your question, then that's about it. Frameworks like jQuery can really enhance a page and make it beautiful and, fortunately, much more user-friendly.
You can't create a website (at least a dynamic one) without a server side language. There you can pull from a number of languages.
If you are just a JavaScript fan, then you can use server-side JavaScript code as Node.js. On the client side you can use jQuery and you can have a supporting database like MySQL.

Client-side only web applications

I am seeing more and more applications that seem as though they are entirely written in JavaScript see (https://chrome.google.com/webstore/) for an example and view the source. As you will see there is no source code except a call to a series of JS files. The app works as though it's still a website though and seems to use the HTML5 history API to alter the address on the fly.
Anyone know much about this sort of technology/design patterns, know some good starting points or examples of their own? I have seen things like Sproutcore and Cappuccino but they seem very different to the way in which the Chrome web store has been built.
I'm looking to use it with frameworks like ASP.NET MVC 3 and CakePHP.
Alot of Googles projects are developed with Google Web Toolkit. It's a framework for building Javascript apps in Java.
http://code.google.com/webtoolkit/

Pure JavaScript-based clients

I would like to know, how powerful/viable are JavaScript only clients based on say, GWT/gxt/vaadin, when compared to DHTML clients such as those made with wicket, tapestry, click etc?
My boss has insisted on using GXT (due to its nice colors and theme) on a project that will most likely become very big with lots of screens. I am against the idea of a javascript only client, especially when the javascript is generated from Java code. I have tried to advice him that we use something like wicket whereby we construct the screens with html but put in ajax where and when neccessary.
How viable is such a JavaScript client? I understand that JavaScript was intended for minor web page enhancements, and not all browsers, especially mobile devices have complete support for JavaScript.
Yes, it is viable for certain applications. Consider Gmail, Google Docs and Google Maps as typical applications where this works, and is probably the most feasible approach.
Some rich UI JavaScript frameworks, such as Ext JS also rely on this technique.
I've built javascript only web apps for ages.
First in SAP projects for big multinationals. And now on a new project:https://beebole-apps.com?demo
So yes it is powerful and viable.
Javascript-only webapp can be extremely powerful, and it's viable for certain applications, say, an Instant-Messenger webapp?
You mentioned that there are lots of screens in your web-app. One of the advantages from GWT/GXT is the fact that you can unit test your UI-layer with JUnit. This is an extra testing you can do on top of, say, Selenium. This is essential if you'd like to make UI testing a part of the continuous integration process, and, as the team grows, you'll definitely want to have tests around to make sure everything works (At least in theory.)
However, if what your boss meant to do is to build an in-house, custom Javascript engine using GWT's JavaScript Native Interface (Link), then I'm not sure...
Another advantage with GWT-like-engine over Wicket is that you can rely on HTML-code-gen to generate standard-compliant (In theory) HTML code. With framework like Wicket, it is hard to ensure every single developer on the team to author good HTML code - Especially when the team gets bigger.
Disclaimer: I'm a member of the Vaadin team.
Our Timeline demo is a good example of what can be achieved with Vaadin and GWT in client side, but I think all of the options presented in this discussions are viable given enough time.
Since you are going to start a big project you should build a simple proof-of-concept app with each of the relevant frameworks. If your PoC includes at least some of the more complex use cases you'll probably can make a pretty informed choice based on the experiences you get while building them.
I urge you to at least evaluate Vaadin. With it you write only server-side Java code and Vaadin will create a slick and professional browser UI for you. Client side can be easily extended using standard GWT (also pure Java), and there are no HTML templates, tag libraries or XML configuration involved at all. A Vaadin UI is fully Ajax'ed and lazy loading out of the box, and it easily integrates with any server side technologies, eg. Spring.
In addition to the development model advantages you get top-notch documentation, a bi-weekly update schedule, a very lively community filled with helpful experts, 100+ useful open source add-ons, and a 10 year old backing company with help on hand should you need it.

Categories