I have been trying to figure out how to learn making a website.
Does all blog or a any news website have to be a cms. Then wouldn't all pages be the same. If not how does one update their website when adding new posts. Can I do it only from database?
It seems if its made only on html and css updating it would involve adding new new html page every time?
For example this website, how do they add new articles?
Would you recommend making a blog on react?
Thanks very much?
Does all blog or a any news website have to be a cms.
I will say, yes and no,
You can dynamically add new html page whenever you have new posts, or blog, then you create a new route for each request. It works fine,(and a lot simpler, and less worry about other stuff, learn from there and then you get a taste of how it works, I will always suggest you to go with something easier, start really small, since you are starting to learn) until you have to post a lot of post, which will be troublesome to update the server code each time.
Where you have to do as follow: Update codebase (new route: /get/my-new-blog-123), then deploy your server code whenever you have a new post to the cloud server, eg: google cloud platform, heroku, etc. Which is a lot of work.
Till then, which comes to what you have mentioned, Content Management System, where most blog post is structure properly, such as how to insert a picture, text style, typography, etc. Then this html structure will store in database, the route will likely be /get-post/?article-name
article-name will be something u can query from database, then your life will be a lot easier with this.
Would you recommend making a blog on react?
Yes, definitely, It is easy to learn, but try not to overwhelm yourself with so many tools, such as formik(form submission), redux(state management), whenever you learn something from a blog, most time you will see this. Which will be quite overwhelming, when you are learning so many stuff at once. Especially, if you are really new to HTML, CSS and javascript.
Start small, learn fast, then grow. All the best to you.
It’s like when you fill out a form
When you press send or save
It’ll go into the backend which means it’s in the database
And from the back end it’ll render to the front which is the website
I can try to elaborate it more if you want.
And you can make a blog using any framework you are comfortable with
Or you can just use plain ol HTML Css and JavaScript.
I think it’s best to start at this before moving to a framework
Related
I am using create-react-app to create Single Page Websites (SPAs). I often have websites with a lot of images and content that require a minor textual change or a minor update. Is there anyway to make these without rebuilding the entire application? If I rebuild it all the image names and everything changes and the whole enchilada has to be uploaded and built for minor changes in content to the website. How can one approach this?I dont want to go back to building in PHP or another platform where individual pages can be tweaked and uploaded without having to upload everything every time there is a minor change. How are you approaching this in building react based websites?
Rebuilding a CRA should not take very long or cost much, you can use a Continuous Integration solution like Netlify to update your site programmatically based on the changes.
Or you can just build an API and write a modular site using the APIs. That is how most CMS work. You should try headless CMSs if you don't want to write all APIs yourself.
if you want to just develop frontend code and don't worry about images, videos, texts and so on you should really try and headless cms that will provide contents via API and a nice editorial console for your users.
There are a lot of them, and for sure you will find one that suits your needs.
I work in ContentChef ( full disclaimer here!!!) which also provides a nice SDK in js or typescript so you can easly get started.
If you want to give it a try: https://www.contentchef.io/developers/headless-cms-for-react
We have a website that's running AngularJS 1.*
but one of our main clients are military personnel and they frequently attempt to use the site via Department of Defense computers. These, of course, have javascript disabled.
I've heard of doing server side rendering, but the majority of the examples and research just mention using it for the initial load. We would need the entire site to run off that principle. Essentially acting like an old MVC site. Is this even possible? And I don't mean with just angularJS. Angular 2(5, whatever version we're on now), or react. I just really don't want to back track to .net MVC
Edit: I realize this is, for all intents, a silly question. I was just hoping there was some awesome new tech that had solved the issues that would be present in even attempting this (as stated below, data-binding. I realize this concept completely defeats the purpose of SPAs)
Thanks anyways. I may just delete this question. Didn't have too many expectations to begin with.
This is very possible! Don't let the rest of the people here fool you.
We have a few websites that work just fine with or without JavaScript enabled. My company website https://bitgenics.io is a React app. If you disable your JavaScript the only thing that won't work is the client-side video player.
Now I have no experience with Angular 1 (and I have heard SSR is hard there), but support should be better in the later versions of it.
Getting the GETs to work is the first challenge. But the next one is that you have to have a fallback for your HTTP POSTs. SPAs often use straight REST calls to do any state changes, but you can't do that because it requires JS on the client.
So your forms have to a fallback of a regular FORM post. So you might need some server-side logic to receive these POSTs and respond with a Server-Side Rendered page again.
I currently have an existing Preact JS site set up but want to add blog section.
So basically easy way to add new pages and routes.
I.e. blog/content-1, blog/content-2
I know I could easily create these pages and routes manually but is there something better out there that fits into existing sites ?
I.e. a lot of the static site generators I see out there, basically you need to run from the start and they generate a new site.
But in my case I just wish to add an extra section to my site which will be the static blog entries, not sure what the best tools out there for this is ?
If any ideas or suggestions would be great.
The preactjs.com website is built exactly how you are wanting to build this. It's open source: https://github.com/developit/preact-www
Basically, fetch your HTML content via Ajax (however you'd like), then render.it as Virtual DOM using preact-markup.
For a real-world example, here's how preactjs.com does that:
https://github.com/developit/preact-www/blob/master/src/components/content-region.js
I'm new to WordPress and I've also been having fun experimenting with Angular/Firebase.
I'm looking to find a way to have an Angular app connect with the WP API in a way that goes further than just displaying posts.
Can someone direct me towards how to submit a form to Firebase and have it simultaneously create a new post and/or page in the WordPress backend? I've come across Zapier but, a) It doesn't seem to be flexible enough for what I want to do and b) It's not free and I'd rather figure it out on my own (with some help from you guys of course.)
I'm plenty fine with being able to use an $http request to list and display posts... but how can I create NEW posts?
PS: I don't NEED to use Firebase. Mainly, I'm really most concerned with creating a new post and/or comment without having to actually do it from the wp-admin.
I have a working website build on top of Google App Engine (Python + Jinja2 template engine). I would like to start redesigning it to be single page application using Backbone.js and Underscore.js. The goal is to use progressive enhancement strategy.
The site will still be rendered using backend on the first visit. And then if the browser supports JavaScript the Backbone.js will take over.
I decided to do it this way for two reasons. First all the links I already have will stay intact and second the Google indexing bot will be able to crawl the site content.
I have two problems with this approach:
I need to have two templates for almost everything on my site one on the backend (Jinja2) and one on the frontend (Underscore.js). I was wondering what are the best practices in cases like this? Is there anything you can suggest to avoid having two templates for everything?
How do I load the templates for the frontend to use Backbone.js + Underscore.js? I can load them all in the initial request or request them asynchronously when they are needed.
I appreciate any thoughts!
Thanks.
Some resources:
http://ricostacruz.com/backbone-patterns/
This one describes how to bind Backbone.js to existing HTML:
http://lostechies.com/derickbailey/2011/09/26/seo-and-accessibility-with-html5-pushstate-part-2-progressive-enhancement-with-backbone-js/
So I recently(this year) went through a similar situation. I'll let you know a head of time that #1 is an incredibly tough thing to deal with. Keep in mind, that you not only would have to duplicate your templates, but ALL business logic surrounding your site. For example, let's say you allow users to add comments on a particular page. Using the method you described, you would have to both have a comment template on the server-side and the client-side, and additionally, duplicate the logic required to add/delete/edit a comment on both the client and the server(to accommodate users with and without javascript). Duplication of the templates is easy using Jinja2 function blocks, but the duplication of the logic is where it gets interesting. I attempted to do just that, and ended up doing a full re-write a few months later.
So the advice I would give to you is ditch the idea that you can support both javascript and non-javascript users. Make your site for one or the other. I personally chose to go the javascript route myself. This leaves you with two options. Make a single page app, or make an app that largely leverages javascript for functionality, but renders everything server-side. There are probably a number of other options, but those are the two most popular that I have seen. I went with the second option. So what I do, is the initial page load is done by the server. Backbone.js then consumes each element and makes models and views out of them. This is largely done leveraging data attributes. So for example to create a comment view I would have an element like this:
<div class="comment" data-id="1" data-body="You Suck"></div>
I would then consume said comment, and create a model out of it like so:
var CommentModel = Backbone.Model.extend();
var comment_el = $('.comment');
var comment_model = new CommentModel($(comment_el).data());
Finally, I would back a view with that created model, which can then add functionality to the site:
var CommentView = Backbone.View.extend({
initialize: function() {},
edit: function() {},
delete: function() {}
});
var comment_view = new CommentView({
model: comment_model
});
Then you might be asking, "What if I need to re-render something, don't I need client-side templates for that?" Nope. Client-side templates are a pretty new thing. I personally try to avoid them as I don't think we're quite there yet, and I have always felt that single-page apps are just not responsive enough for my tastes. I'm sure there are plenty of people who would disagree with me on that, but that's the stance I took with my most recent project. So that being said, I render everything on the server and send the html to the client in the form of JSON, which I then inject into the DOM. So I have a ton of api endpoints, which return JSON to my Backbone.js code. This is what is currently working out for me, but this problem is largely situational usually. You have to really look at what your needs are. For it's worth, I largely based my current system off of what Twitter eventually decided to do after trying the whole single-page app thing. You can read about it here.