IMAGINEYOUR.SITE

This is a copy of a site I made like 3 years ago, beware of the outdatedness of it. The imagineyour.site domain redirects here!

THIS SECTION WAS UPDATED MARCH 15th, 2022.

Navigate This Page

• Learning Summary & Outline
• Learning Resources
• Table of Contents
• My Rambling

Read a copy of my original tumblr post here

A quick learning summary and outline:

You should already have a basic grasp on what a computer is, what files are,
ect... if you do not know, please Up your literacy first!

INFORMATION IS POWER! BELIEVE IN YOURSELF!

The more you know, the better equipped you are to succeed

not just in coding, but life itself.

first, learn your web fullstack:

Terms

• Frontend Development is commonly used for static websites - that is, what you code into the file is what shows up. Almost all free webhosting supports static websites, with javascript as a more freemium option as it is dynamic-lite.
• Backend Development is used more for the dynamic aspects of a site: automating links and code, pulling images from a directory and displaying them in a gallery, content management services like blogs or forums, and login areas. Free hosting usually does not support these, or only PHP, as these files interact with the server and can break sites.

For FRONTEND: You should learn HTML FIRST, CSS SECOND, and JAVASCRIPT LAST.
Start learning the artistry of design as well if you wnat to make
an appealing, eyecandy website. Or just slap on Bootstrap!

• Hyper Text Markup Language (HTML) is the BAREBONES of a website,
  presenting the content of the website and the basic of basics
• Cascading Style Sheets (CSS) is the style and wardrobe of your
  website. It's what gives color and design to your pages.
• Javascript (JS) is a simple frontend programming language, meant to make
  your pages more fluid and interactive. Best described as simple magic

For BACKEND: You should learn PHP FIRST, MySQL second, and PERL LAST

• PHP: Hypertext Preprocessor is your first head dive into how a single file
  can contain multiple pages, how a Content Management System (CMS) works,
  ways to mail via PHP, better interactive forms, and so much more.
  This is more involved than JS, and unlike frontend code, does NOT display
  when you view a page source.
• My Structured Query Language (MySQL) is a database where information is
  securely stored and grabbed via PHP. You can try and make database-less
  PHP code, but for huge projects, you're gonna need a database to keep organized.
• OPTIONAL: Practical Extraction and Report Language (Perl) is the equivilent of running
  computer programs on a webserver, and can be a powerful tool along the way.
  You don't exactly need to know Perl nowadays, but some webservers still use it
  so it is useful to know about.

If you're only going to buy hosting, thats all you need to learn, however...

For more advanced coding techniques, to using libraries, and maintaining your own webserver:

• You should learn THE COMMAND LINE/TERMINALS, and start learning LINUX
  for WEB SERVERS (A windows webserver is horrendously vulnderable to attack)
  LEARN basic commands, how to install packages, how .sh files operate.

Have a little fun and learn about older computers too, while youre at it!

New age web design uses compilers and library browsers like NPM & Composer
require you to know how to run commands on a terminal/cmd for their content.

Since most of you are learning coding in a new way than I did, learn your frameworks*
for each programming language once you feel proficient enough to make your
coding go by faster.

PLEASE: Get a hold on the vanilla/basic aspect of coding (not using injected code),
before you start using any script "libraries".
As you learn to build your own code, you will set yourself up for success in
the long run as you get ready to make bigger projects. THEN you can start hitting
up librarys!

FRAMEWORKS & Librarys to learn about:

• Bootstrap, a CSS framework and the most commonly used layout you see today.
  Almost ALL websites use this so their sits are "mobile friendly"
• jQuery is the first JS library you should learn, so you can interface with
  React.js and Angular, common libraries for Javascript GUI
• Node.js is a Javascript Backend
• Ruby on Rails is a framework build on Ruby meant to make fullstack development
  much easier than it has in the past (though its been around since 2004, I justlearned about it recently)
• ELF is incredibly reactive and fast, and runs like rails but for more modern lightweight sites.

^ to top

TO LEARN: FREE Web Development Classes & Certifications

Are you a student? Github Education offers an Intro to Web Dev experience
as well as a free .me domain. You MUST have a high school/college email to apply.

Other Tutorial Sites

Neocities offers HTML tutorials as well as a free
web site (frontend languages only)
FREE Tutorials Site AND huge reference
FREEMIUM: CodeAcademy Has the courses for free, but you must
pay for certifications.
PREMIUM: edX Learn from industry pros...
PREMIUM: Udemy Online college courses.

Dodo's New World Tutorials (archive) Helped me learn a lot about basics when I
was younger. (circa 2007-2008), Kiiinda dated

Textbooks

psssst! z-lib is your best friend for any textbooks btw...

^ to top

Table of Contents

Usefull Links

• 0. USEFUL PROGRAMS
• 1. FRONTEND DESIGN
• A. HTML/CSS
• B. LEARN YOUR DESIGN
• C. JAVASCRIPT
• 2. BACKEND DESIGN
• A. RESOURCE
• 3. FULLSTACK RESOURCE
• 4. LEARNING COMPUTER BASICS & SERVERS
• 5. COMMON FRAMEWORKS, RUNTIMES, TEMPLATES, ECT
• 6. FINDING A DOMAIN NAME & HOSTING

My Rambling: Why build your own website?

^ to top

Credit

She not only gave me a feul for my love of computers and technology, but the spite I need
to keep designing websites (She said that Web Design will phase out in the near future...
yet now we use Web design for COmputer Apps and Twitch Streams!)