HTML5 Skeleton: A Basic Template File

Srikanth Kumar — Thu, 16 Jan 2020 15:15:07 +0000

Why & What?

HTML5 Skeleton is basically a boilerplate, because we developers do NOT want to use a blank html file to start with, we’ll use a already-made boilerplate.

Just like writers get the writers block, you might get a “developers block“.

So here’s how to create one:

If you are using Visual Studio code (VS Code) then it’s pretty easy. Just use the keyboard combination: (place cursor on the first line) " ! + Enter " and that will generate a HTML5 skeleton for you.

The Boilerplate
Jobs, TSPSC, Notifications, Recruitment, Admit Cards, TSPSC
If you just want to copy/paste, Here’s the code:

<!DOCTYPE html&gt;
<html lang="en"&gt;
<head&gt;
    <meta charset="UTF-8"&gt;
    <meta name="viewport" content="width=device-width, initial-scale=1.0"&gt;
    <meta http-equiv="X-UA-Compatible" content="ie=edge"&gt;
    <title&gt;Document</title&gt;
</head&gt;
<body&gt;

</body&gt;
</html&gt;

Originally written at Brainly

Getting Started With Django!

Srikanth Kumar — Thu, 09 Jan 2020 14:31:34 +0000

Originally written at: https://brainly.to/django-for-beginners/
Introduction to Django

Django is a back-end web framework, it can handle user registrations, logins and more. It has built-in security that can protect from most of the common exploits. Django also hashes passwords handles emails and forms that can be further validated.

Django is a kind of hard for me as I am used to WordPress, I mean I know that it is a CMS but still I am so used to it that any other thing is harder for me now.

I personally wanted to develop a portal that can used by students so they can easily know important information about placements and job offerings.

I also wanted to implement 2-Factor Authentication but I’ll see that later.

I am a seasonal developer, I mean I don’t code too often as I am a student. Here are my findings and how I started with Django.

Setup
Important downloads and environment setup: Python, Django

It is required to check for pip availability for installing Django, run this command in cmd: pip -V

If you do not appear to have pip, install it with this command: python get-pip.py

This command helps for download Django: python -m pip install Django

But before we begin, it is at least required to know the basics of below mentioned web languages.

Prerequisites:

Python
HTML
CSS

You can still follow along as long as you are comfortable with the flow:

I first downloaded bootstrap theme for a boiler plate and then edited as required.

This documentation is based on localhost using Django.

From the command line, cd into a directory where you’d like to store your code, then run the following command:

django-admin startproject mysite here, ‘mysite’ can be any name.

Then: (this is what you should get)

Inside “mysite” folder:

In this directory you can see many files that are created. The most important of all is the manage.py file. It is used for running the server.

You can run the server and see it live by running the following command:

python manage.py runserver

You’ll see when you go to, http://127.0.0.1:8000/ you’ll see:

The install worked successfully! Congratulations!

Phew! The installation part is now complete.

To stop the server, just use this shortcut: “Ctrl+C” once or multiple times (in some cases)

The Development
You can use a IDE like Visual Studio Code for browsing through the files.

I’ll explain basic functionality of important files:

manage.py : It is automatically created when you create a new project, it is used to mention installed apps if any.

urls.py : urls and permalinks are stored here, you can create pages that link to views.

views.py : you can register

views.py : is where you link the functionality to an URL path, we’ll go through this as we go deeper into this topic.

models.py: you can create models for later usage.

I imported all my bootstrap files to Django project folder for linking resources.

To link a HTML file, go to urls.py :

from django.contrib import admin
from django.urls import path
urlpatterns = [
      path('admin/', admin.site.urls),
]

There, you can specify your permalink on the left and reference of the site on the right.

Note that before you are going to to create an application, you need to have view.py, models.py these files are created once you create an app (a section of functionality)

To create an app, run this command on inside your project folder:

python manage.py startapp exampleapp

‘exampleapp’ can be anything. Once that is created, you can see a folder named ‘exampleapp’ is created inside the project folder. And this includes all necessary files that are needed to build some functionality.

Now, the ‘exampleapp’ is not yet linked to a url.

Unfortunately though we have to create a new urls.py inside the ‘exampleapp’ for linking views to that urls.py model.
To do so, follow:

create a new urls.py and write the following code (we are adding a path for a view that is created inside views.py:

#We are in mysite --> exampleapp --> urls.py

from django.urls import path
from . import views

urlpatterns = [
    path('', views.home, name='homepage'),
]

Inside the views.py:

#We are in mysite(in the root folder) --> exampleapp --> views.py

from django.shortcuts import render
from django.http import HttpResponse
# Create your views here.
def home(request):
    return HttpResponse('< h1>The Home Page</ h1>')

Now we link the ‘exampleapp’ to the main project urls.py like this:

#We are in mysite(root folder) --> mysite --> urls.py

from django.contrib import admin
from django.urls import path, include

urlpatterns = [
    path('admin/', admin.site.urls),
    path('exampleapp/', include('blog.urls')),
]

Basically, we’ll create multiple apps (functionalities) that are dependent on each other and they output as web pages.

Now its time to run the server:

python manage.py runserver

Result:
You’ll see that when we open this URL: http://localhost/exampleapp/ on a browser you can see:

The Home Page

Now, the you know how everything works!

I know it takes a heck lot of time navigate, understand and implement your changes but, it takes some time to get used to.

We’ll move on through this development in the Part 2 at Brainly that contains further development from here, which I’ll be releasing in few weeks.

DEV Community: Srikanth Kumar

HTML5 Skeleton: A Basic Template File

Getting Started With Django!