How a novice web developer would go about creating a website? - Developers

Hi guys, So basically, while I am quite (I suppose you can say that) knowledgeable in HTML/CSS and JavaScript, I am still very new to properly creating websites from scratch. What kind of things I should keep in consideration? I'm talking about principles of writing pages, technologies to use to be "modern", etc etc. Like, what should I even start with? I already have a basic idea and concept for a website, I am talking technically wise.

No one is going to want to download a zip file off the web. You should look into https://github.com/ and if you're a student, there's a lots of neat stuff you can get for free Student Developer Pack (also with github u can actually launch a static website from it for free if it's a public repository)

Apart from telling me to post code on github, this doesn't really answer my question. I'm also not a student anymore btw. Updated the link with github repo. I'd still love some second opinions about this.

It boils down to creating a website for my parents' side business for a tour agency of sorts. Sounds like you're probably wanting to build something interactive? I work for a company that makes travel agency websites and booking systems for some quite big clients and it's not easy stuff. Or is it just more of an 'about' page and a contact form sort of thing? Looking at your GitHub repo, looks like you're on the right lines for a static page. You can get free hosting if you rename your branch to 'gh-pages' and then you'll be able to access it via https://altair312.github.io/tourtest Looks like you've got the main idea though. I recommend moving your styles into a seperate .css file though, inline <style>'s aren't nice unless it's literally a one page site (and even then, there's not really any excuses). If you can tell us what you're trying to build maybe I can give some pointers?

Typically if I'm telling someone to make a website, I'd generally recommend keeping the front end and back end completely separate projects. It's a little more complex this way, but way better. If you have experience with javascript and front-end technologies, it sounds like that part will be relatively easy and you just need to learn some backend/api/databases. Honestly, what I would recommend technology wise really depends on what you're trying to do. If you really need some nice UX, I would build out a front end in React or whatever framework you want then build a lightweight backend API that makes database calls. People argue Vue.js is best or React is best, but when it comes down to it, It doesn't fucking matter as long as you solve the business problem. If you just want to learn the basics working front to back in one project, I'd recommend something like Ruby on Rails. It's well documented, simple to get started, and what you are trying to do has probably been done before, so if you run into an issue they'll be a stackoverflow on it. However, generally RoR projects tend to turn into a giant ball of mud once your project gets to a certain size. Also, integrating a nice javascript front end has been a giant pain in the ass every time I had to do it (thanks to sprockets and the asset pipeline), but it can be done. Anyway, based on your github, I'd say build out a front end page in React or something. Read the react website, or google some tutorial and start with the create-react-app. When you need to start persisting data, then build a backend API that saves to a database. It will be quite a bit to learn, but worth it in the end. Hopefully this helps

Jumping to React/Vue is a bit overkill at this point. We don't even know what sort of site he wants to make. > (thanks to sprockets and the asset pipeline) Rails now has first-class Webpack support and can automatically be configured with a flag. Fully integrates with Yarn etc. See: https://github.com/rails/webpacker#installation

Unless he needs a completely static site, I would still use a framework because you can grow into it. If you start writing a shitload of jQuery event listeners, and then realize how much of a mess you made, its harder to switch at that point. But other than that, I'm glad to see the webpack support. I have wasted so much time trying to get javascript to work with rails

OP: going off-topic a bit here. https://github.com/reactjs/react-rails This is pretty magical. If you want to render a react component in a Rails view it's simple as: <%= render_component('NameOfComponent', { name: 'Test' }) %> Literally renders the React component right on the page where you put the tag with the props being whatever you pass in as a hash to the second argument. Saves a lot of time if you don't want to build a full SPA but still want to encapsulate your JavaScript stuff.

On the contrary, my site is static so I don't think I would require any "back-end" in terms of server-side. I know quite a bit about HTML/CSS/JS (so yeah I know about "index.html", htaccess, trying to avoid inline styles etc), so it's a non issue for me, the main thing I was asking for are pointers in... I dunno, modern web trends and how to make my website appear 2018 and not something coming straight from Web 2.0 era. Hence I asked about stuff such as smooth-scrolling and some other eye-candy that I should look into implementing in a website, as well as some particular design considerations for the website. I'm pretty sure I do not need Vue or React for this purpose specifically, and no databases as well.

It sounds like you want to have design inspirations to make it modern. I'm not a designer so I can't help what the modern trend is, but you can take a look at https://www.awwwards.com/ to get inspirations for that. you dont really need to get fancy with smooth scrolling tbh. As a tour agency, you probably want to get straight to the point as first thing a user sees.

I actually used that on a client project. It worked great

Remember the #1 most important thing while learning to code is... "Code to learn NOT learn to code" youtube.com codepen.com tutorialzine.com scotch.io

Basically every time you write code you're writing more code you'll need to maintain in the future. So you should learn to achieve what you want to achieve using code with as little code as possible (whilst still being readable, testable and maintainable).

Your first example with 'by reading documentation' is a definite thumbs up. Normally you can dig deep into the docs of a library/framework and pick it up pretty easily if the docs are up to par. It's also a good skill for employment. If you can prove that you can read docs and achieve your intended behaviour that can be seen as 'problem solving'. A lot of places like that attitude. A good chunk of web development is Google-Fu and reading docs.

I'm so happy that nobody suggested WordPress

They'd be run out of town on a pitchfork

Fuck that shit, as soon as I wasted 3-4 days after trying to salvage previous website that was on WordPress I just said I'm either starting over or not doing at all.

It's good at being a blog or throwing together personal sites. Arguably the least worst out of the box CMS out there. For anything more complex though, nope. I hear people have success using it as an API since it comes with the very nice admin panel.

I wouldn't even say it's good at being a blog, it doesn't even have Markdown support out of the box. Also still has the really awful bug where changing from HTML view (which still has no syntax highlighting) to the WYSIWYG view changes the HTML, which in some cases can break pages

I've been teaching myself web development practices by tearing apart frameworks and looking at how they work. I also have a book from a few years ago that I can reference as needed.

That's very debatable. I'd definitely pick Grav for example first.

Hmm, never heard of that one. Beautiful website they've got. Looks interesting.