How to setup Codekit to refresh pages when I updated my mako files? - mako

Hi so I'm working in PyCharm using the Pyramid Python framework and using the template system Mako, .mak files.
With LiveReload I was able to add the .mak file extensions and it was able to refresh the pages I was working on.
I'm not sure how to do that with Codekit

Just figured it out, in preferences > languages I added mak
Then back in preferences > general I have to make sure that my localhost / ip had to be included in the Auto-reload browsers section.

Related

Opening Index.html leads to a blank page

I'm new to web development and found a website prototype, but when I tried to open it by clicking on the index.html in the files, it's completely blank. The only thing I see is on the tab, and it just says "React App".
How do I make the website components actually show? I know there should be something showing because I can see all of the code and pages, but nothing shows?? Is there some other way to open the website?
React is a library that compiles all your javascript then renders it in index.html file. If you open the file directly you won't see anything. If you want to run your project then:
Open the project folder in vscode.
Press CTRL+J if you have windows.
Type npm install - It will install all project dependencies listed
in package.json at the root of your project.
Then run npm start - This will start development server locally
that you can use to develop your project as you go.
Then go to App.js and make changes and see how the server
automatically refreshes.
to learn more, go to Get started with react - FreeCodeCamp

Index.html/index.php not found in Google CodeLabs app shell

I was interested on on Google's web app-Shell. I've downloaded it GitHub. But I found that there is no index.html/index.php file in the whole code. All I mainly found, is the licence file, app.yaml file and app.js file. Link to that page, is here.
I heard,that I can install the project in my web hosting site, by using terminal. But terminal is not an option for my situation. I've stopped using Firebase, because I must have terminal for it. So, is there any other idea to install the project in my website?
Can I have a flat file, so that I could simply past the html,css, JavaScript and other media files into my server?
Unfortunately the Google web app-Shell isn't designed to have an index.html file. There is a views folder that has what you're looking for https://github.com/GoogleChromeLabs/application-shell/tree/master/server/views.
As we can see they're using handlebars for as a templating system. For example, if we look at https://github.com/GoogleChromeLabs/application-shell/blob/master/server/views/layouts/default.handlebars we can see that they have {{> open-page}} and {{{body}}}. If we look at handlebars documentation these partials are rendered into other views.
Essentially, there isn't a single index.html we can point to, but we can reconstruct the app by exploring their views.

Auto refresh wepage when source file changed

I have been learning web development for some time and I have noticed on tutorials on youtube that when someone change source file (html, css, js) the webpage opened in browser is automatically refreshing. I have read something about live-reload but it's too complicated for me and there is no step by step tutorial.
I have found some similar questions, but the case is that refreshing happens by side of local server not the code editor or browser as is mentioned in questions that I found.
I'm using Apache as my local server. Sublime Text for writing a code and Ubuntu operating system.
Here is the video that shows what I am exactly trying to say.
https://www.youtube.com/watch?v=q78u9lBXvj0
Npm and live-server doesn't work on my computer at all.
Sorry for my english, but I'm not a native speaker. I'm looking forward for your help.
Anyone knows anything?
Install sublime web server using package manager ( or in your case continue to use Apache )
Use http://livejs.com/

Live Reload not working (WIN7)

I have the windows application installed, Live Reload extension for chrome and i'm using Sublime Text with Live Refresh and Live Reload plugins. For some reason any HTML doc i edit on sublime text is not auto updating on chrome. The extension is stuck on "Live Reload is connecting" when i enable it. What exactly am i missing, do i need to setup a local web server or something like that?
I think your issue may be that you did not add the folder that contains your HTML document to the LiveReload windows application so that it can monitor for changes to the file.
If you open up the LiveReload app, it should have a list of site folders. Try adding your test project's folder to the list.
If you load from local file it does work you must runt the local file through a web server e.g python -m http.server in the folder your .html exists otherwise the option match to local file never appears and then you can have the save and reload functionality.
I mention it because I hadn't found the problem through reading the post

Wordpress templates to HTMl + CSS

I have a wordpress template and in that there are many PHP files and CSS files. I just want to know how can i convert every php file into HTML file so that i can check them in the browser and i want to change wherever i feel necessary.
You need to render them with a machine that has PHP with Wordpress installed, and you could then save them as HTML from there.
The quickest way to do that would be to use EasyPHP or XAMPP (assuming that you are on Windows).
To follow up on what #Blowski said. Here is a useful article which will help you walk through the right steps to installing XAMPP on your machine. Using XAMPP For Local Theme Dev.