I have recently started working on polymer starter kit. I see that index.html is served as the site hosted at localhost:3000. It is a single page app, which handles a few routes client side. I am trying to build a multi page site using polymer. Pages would share some resources (toolbars, custom-elements) but are all single-page apps themselves.
Either I can:
Work and serve multiple pages on different routes from gulp server itself. Vulcanize can efficiently inline/pack the resources then.
Work on individual pages as separate projects. When deploying take their resources and merge manually.
Second option does not look like a good idea. How can I extend the starter kit to build/ serve multiple pages.
Update
I found that the starter kit uses browser-sync which handles routing but it is minimal. The workflow isn't working for me (anyone who knows better please suggest). You can build the frontend without routes, but when you have to take it to production you would want to integrate it with your server, which has routes. So integrating both and testing it end-to-end is complex and painful.
The lack of routing hurts me more than not having to reload my browser. By routing I mean mapping of URL's to files on disk. I would want to control it and change routes easily. I have decided to ditch browsersync and use the following workflow:
Gulp for frontend rebuild on file change
Express server for routing and serving the build reload on route change and above
Can anyone tell how to integrate both.
Related
Web Developers!
How do you go about organizing your Github projects for your front-end and back-end?
For example, I have a python script that generates a JSON file that the front end JavaScript consumes to generate data on the pages.
Would you create one repository with two directories labeled front-end and back-end?
Or would you make two different repositories?
I'm interested in what developers do in the wild. Because up until now I found myself having a complete clone of my website in a directory on my desktop PC, and just pushing individual files via SFTP from there.
I'm getting to the point where I have enough *.old files that I want to implement version control so I can view much older states of code with Metadata like date and user that edited it.
The answer is yes. Make two different github projects.
Just Like Michael W has stated, "[...] this is highly opinionated". What I find to be the most common approach is to implement a single github project when still in development and especially when you're developing on your own. This is useful because you don't have to switch up between repositories and/or branches, which saves time.
Another common approach is to split them up. However this approach is only possible when both projects can run independent from one and other. In your case it's important to split the project logically. If the python project only generates JSON files and places them on a server location, then I would place that into it's own github project, because the main purpose is to generate files, so the python application can run on a server seperate from the frontend. If the webapp only consumes the JSON files through maybe a rest call or through a connection to a FTP, then also that can be placed within it's own project.
I'm trying to deploy a simple Website - a couple of html sites based on twitter-Bootstrap templates - on cloudControl.
Unfortunatelly It seems I can only deploy a Java, PHP, Node.js and some more applications but not just some html sites.
Building a Java or any other application just to show some html sides seems to be an overhead to the scope.
Is there any suggestion how I just can deploy html sites to cloudControl ?
I would suggest php, the buildpack automatically provides apache as web server and delivers static html files directly.
In all other cases you have to provide the server by yourself and it seems like you just want some static html pages.
I think NodeJS would be your simplest option. Start with a simple server like this..
https://github.com/spadin/simple-express-static-server
Put your HTML/JS/CSS files in /static, and it's ready to deploy
I'm trying to make a multiplatform offline webapp using PhoneGap. I know my html and css, but I'm not altogether familiar with the full capabilities of JavaScript, and I've never made a webapp before, let alone tried to use phonegap to empower it.
Right now, I have the main index.html that phonegap sets up for you, but now I'm uncertain as to how to proceed. If I want a button to take the user to another page from the main page, should I make a second html file and literally link between them, or is this a lot more complex than that?
Also (get ready for a possibly epically stupid question from a total beginner):
Do web apps have to be online? I'm really not clear on whether they function like normal websites in which they need to be hosted on a server, or if they can be packaged up and downloaded just like normal native apps. Please help!
Thanks.
Oh, and btw, I'm working in Xcode with the phonegap addon thing....I'm trying to get it running on the iphone before I move on to android.
Although the other answer helped me at the time, I thought I would add a more complete answer now, five years later, to my own first StackOverflow question.
To start with, a "web app" is the same as a "website" in a technical sense, and yes, they have to be hosted on a server in order to be accessed through the browser...just like every website. The only distinction is that a web app is generally a more dynamic and complex sort of website, involving JavaScript and AJAX. It would be misleading to call a simple website like this one a "web app," whereas Facebook is definitely a web app. Basically all web apps are websites, but not all websites are quite exactly web apps.
However, it only has to be "online" if you want it to be accessible anywhere from a browser via http. If you're making a Cordova app like I was at the time, that's not relevant. If you only want to run an application locally, you can do so with a local server like Python's SimpleHTTPServer or the one webpack provides, or any other alternative, including a server you write yourself from scratch.
As for the primary question about having multiple pages, yes anchor elements like my link are the standard way of connecting pages. To link among your own pages, you would have multiple .html files, and you would create a link with an href like href="myOtherPage.html", where that file is contained in the same directory as the file for the page linking to it. Alternatively you could set up a single-page-app where JavaScript loads new page content without the use of anchor elements-- in that case multiple .html files are not needed. Frameworks like Angular and React are helpful for accomplishing that, but it's by no means necessary.
In a typical web app, most of the time you would just need to create a link as you would if you were creating a link on a website. Also, Web apps can be developed via a local environment (research Mamp/ or Wamp) depending on the dependencies in which your app require.
At the moment I'm learning spring and have the basic website running now on tomcat. Can I ask, how do you load images onto the website now and where do you store the images, css, javascript etc in your project folder?
The answer depends a lot on your development/deployment environment. If you are using Maven for example, which has a specific directory layout, you would put the files in src/main/webapp/.
If you are using Eclipse as your IDE and use Ant to build your project, you would normally use WebContent/.
In any case, I would advise to use specific folders for each type of file. You can still use Tomcat Filters, if you want to influence the headers that are sent with the files. (Important for caching, ...)
I'm developing an website now.
I found there are lots steps to do before deploying the code to web server.
e.g.
1. compact JS/CSS/HTML
2. Run unit test if any
3. Test code locally
4. Upload code to web server
Not sure if anyone could share your experiences on this process? Or how does facebook/google/yahoo ... do this?
Deployment strategy entirely depends on your project. None of those steps (except uploading code to web-server of course) is mandatory for running PHP web-site. Those steps appears when you are trying to:
Utilize build system (for configs generation, JS and CSS minification, etc);
Write unit-tests and (probably) run continuos integration;
Establish quality assurance by having QA go/no go before deployment of new release.
Needless to mention that to make, for instance, JS/CSS minification or perform unit-tests execution, you need to implement ones first.
That's why I'd not advice you to follow cargo-cult and copy all features of smbd's project (even facebook or google). Instead just follow the project needs and build your own deployment strategy.