₦airaland Forum

Welcome, Guest: Join Nairaland / LOGIN! / Trending / Recent / New
Stats: 1,914,535 members, 3,922,704 topics. Date: Monday, 20 November 2017 at 10:44 AM

Take Your Web Development Skill/Career To The Next Level By Creating A Web App - Programming (2) - Nairaland

Nairaland Forum / Science/Technology / Programming / Take Your Web Development Skill/Career To The Next Level By Creating A Web App (3029 Views)

Creating A New Programming Language / Creating A Proxy Server With Java. / Creating Apps In Kivy By Dusty Phillips. Ebook Download (1) (2) (3) (4)

(0) (1) (2) (3) (Reply) (Go Down)

Re: Take Your Web Development Skill/Career To The Next Level By Creating A Web App by Collins4u1(m): 5:14pm On Sep 11
kreativemind:


There is lecture. I have been busy. Sorry about that. Will continue in few minutes.


I hope we are all ready?

yeah
Re: Take Your Web Development Skill/Career To The Next Level By Creating A Web App by Doughboysss: 7:37pm On Sep 11
Good evening @kreativemind

Updated

Re: Take Your Web Development Skill/Career To The Next Level By Creating A Web App by kreativemind: 9:23pm On Sep 11
Doughboysss:
Good evening @kreativemind

Updated


Very Good
Re: Take Your Web Development Skill/Career To The Next Level By Creating A Web App by nohuneg: 8:55am On Sep 13
From online shopping to job searching portals, web apps foster communication between the right parties to drive transactions. Building solutions with robust back-end admin panels, our Web App Development is guaranteed to provide high engagement for your audience

Custom solutions have a massive advantage over off-the-shelf products as they are lean, branded according to guidelines and tailor made to address the business goals.

Re: Take Your Web Development Skill/Career To The Next Level By Creating A Web App by kreativemind: 9:02am On Sep 13
Good morning everyone......

Hope we are ready?
Re: Take Your Web Development Skill/Career To The Next Level By Creating A Web App by kreativemind: 9:15am On Sep 13
Now, let us write some set of instruction for what to do if the connection is not correct.....

//DATABASE CONNECTION
$conn = mysqli_connect('localhost', 'cms', 'password1', 'cms2.3') OR die('Unable to connect because '. mysqli_connect_error());

1 Like

Re: Take Your Web Development Skill/Career To The Next Level By Creating A Web App by kreativemind: 9:51am On Sep 13
Next : We will create table inside the database to hold the page information.......

Step 1 : Open the database that you created through "phpmyadmin". Mine is "cms2.3"
Step 2 : Enter the table name and the number of column for you table

Note : If you are coming from the background of creating static website. Then, don't worry, this next step will make is easy for you to create a cms for your website.
If you also the type that create several php file for each page i.e home.php, about.php, contact.php. Then this tutorial will also make is easy for you to create a single page application by loading our content from the database into a single page.


Now, let us proceed with the tutorial'

Step 3 : This are the columns that we need in our table. We need four columns
i. id
ii. title
iii. body
iv.

Step 4. Enter the table name. Mine is "pages" and enter the number of the column i.e "4" and click "GO"

Step 5 . Enter the name for each column as well as the datatypes

1. Column 1 name is "id".
Datatype is "INT" i.e integer.
length : 11.
Note "You can put any number in the length field". It depends on the number of character that you want and your target.
Now go to index field for the "id" and choose "Primary key"
Check the "AI" box i.e auto increament.

2. Column 2 name is "title".
This title is the one that will show in the browser tab bar. i,e <title></title>

datatype is "Varchar" i.e variable character
Length : 200. You can use any number

3. Column 3 name is "header"
This is the header for the body of the page

datatype is "varchar"
length is "300"

4. Column 4 is "body"
datatype is "longtext" i.e you will be able enter a lot of character in this field

5. Click Save

Note : Please check the screenshot for better understanding.......

Re: Take Your Web Development Skill/Career To The Next Level By Creating A Web App by kreativemind: 9:53am On Sep 13
If you can get the table structure correctly. Then we can proceed.
Waiting for the screenshot of your work guys......................................


YOU CAN DO IT!......................................
Re: Take Your Web Development Skill/Career To The Next Level By Creating A Web App by kreativemind: 9:58am On Sep 13
Feel free to drop your questions on the table creation if you need my help...........
Re: Take Your Web Development Skill/Career To The Next Level By Creating A Web App by proxy20: 12:29pm On Sep 13
nice tutorial bro. continue I am remembering some things in php
Re: Take Your Web Development Skill/Career To The Next Level By Creating A Web App by Doughboysss: 3:50pm On Sep 13
Updates

Re: Take Your Web Development Skill/Career To The Next Level By Creating A Web App by kreativemind: 3:53pm On Sep 13
Doughboysss:
Updates

Very good
Re: Take Your Web Development Skill/Career To The Next Level By Creating A Web App by MCzubby247(m): 2:01am On Sep 15
bro, you are doing create, I love I
every bit of it .
can I ask you do all programming follow the same?
eg
like android if I have to create the layout or front end is there get bootstrap for it than to start from scratch to cre
Re: Take Your Web Development Skill/Career To The Next Level By Creating A Web App by kreativemind: 9:46am On Sep 15
MCzubby247:
bro, you are doing create, I love I
every bit of it .
can I ask you do all programming follow the same?
eg
like android if I have to create the layout or front end is there get bootstrap for it than to start from scratch to cre


I don't understand your question very well. Are you asking if there are frameworks like bootstrap that makes development of andriod app easy for the UI part?

Better still, you can tell me what you want to do or achieve and i will try to simplify it for you.
Re: Take Your Web Development Skill/Career To The Next Level By Creating A Web App by kreativemind: 9:47am On Sep 15
Good morning everyone, we will start today's class. Sorry for the delay and i hope we don't have any issues with the previous tutorial i.e your output is like mine and everything works fine.


See you soon..............
Re: Take Your Web Development Skill/Career To The Next Level By Creating A Web App by kreativemind: 1:05pm On Sep 15
Next : We need to insert some records into the table that we create

1. Open the table that you create by clicking it
2. Locate insert tab and click it
3. Your page must look like the attached picture.
4. Open another browser tab and go to http://www.lipsum.com/

Re: Take Your Web Development Skill/Career To The Next Level By Creating A Web App by MCzubby247(m): 1:39pm On Sep 15
kreativemind:



I don't understand your question very well. Are you asking if there are frameworks like bootstrap that makes development of andriod app easy for the UI part?

Better still, you can tell me what you want to do or achieve and i will try to simplify it for you.
<p>
I'm learning on my own android studio but base on the video tutorials I have to build from scratch, XML, java. my question are there short cut like what get bootstrap does to web?

bro, I think you can be of good help to me, could you advice me?
4 years ago I ventured into web programming I know a little about web HTML, CSS and php, but I have an idea on mobile I want to work on.
Now the issue is that my visa to travel will be ready in a month or 2 and I want to attend a bootcamp on mobile dev but if I attend the bootcamp I won't be able to foot my travel.
as a mobile dev how much can I command per month to stay back and forfeit my travel or move ahead to Europe.
sorry I'm on transit typing this might have lots of typo error
Note: I lived in Ukraine for sometime.
expecting your response..... </p>
Re: Take Your Web Development Skill/Career To The Next Level By Creating A Web App by kreativemind: 2:47pm On Sep 15
MCzubby247:

<p>
I'm learning on my own android studio but base on the video tutorials I have to build from scratch, XML, java. my question are there short cut like what get bootstrap does to web?

bro, I think you can be of good help to me, could you advice me?
4 years ago I ventured into web programming I know a little about web HTML, CSS and php, but I have an idea on mobile I want to work on.
Now the issue is that my visa to travel will be ready in a month or 2 and I want to attend a bootcamp on mobile dev but if I attend the bootcamp I won't be able to foot my travel.
as a mobile dev how much can I command per month to stay back and forfeit my travel or move ahead to Europe.
sorry I'm on transit typing this might have lots of typo error
Note: I lived in Ukraine for sometime.
expecting your response..... </p>

1. Am sorry to say this, as far as i know. There is no shortcut to it although some frameworks or platforms makes it easy. Especially in the Hybrid app department. Where you will use your knowledge of HTML, CSS etc and AngularJs e.g You can use Ionic Framework.
A lot of technologies are also coming out. Sometimes this is scary..... cheesy....very soon mobile app development will be like drag and drop things. But for now you will still need to work ooooo. No shortcut sir.
For me you are already on the right track.
What i normally advice people is to do some research on the language or skill that they want to learn before going to bootcamp or watching some video tutorial. While all this bootcamp and video tutorial are good, they will help you more when you have a basic understanding of what you want to learn and why you want to learn it.

2. Regarding the visa and the bootcamp. Normally, i don't know why you want to get a visa but i can tell you this.
There is nothing wrong with going to bootcamp but you don't have to go before you master it. Though bootcamp make it easy because of the environment but many good programmers don't go to bootcamp before they become an expert. I learn from ebooks and video tutorial and it really helps me a lot. Although what i should have cover in a matter of two weeks if i attend the bootcamp. I may have to do it in a month since am doing it alone and a lot of factors can affect my focus.
Now, so far the bootcamp is free, there is nothing stopping you from going, believe me, what you will learn in few weeks will really set a foundation for you so much that all others things that you will learn on your own will become easy for you and you will not have to forfeit your travel. Just remain focus and know that you are different from the others that attend the bootcamp, you have limited time, so strategies things that will make it easy for you and fun as well.

Never forget the fun part. Don't be like many programmers that thought frowning there face shows that they are a good programmers. Your brain need to relax to process more code...... cheesy cheesy cheesy cheesy......

Am always here to help you. All the best bro
Re: Take Your Web Development Skill/Career To The Next Level By Creating A Web App by kreativemind: 3:06pm On Sep 15
Back to the turorial

On the insert page, the phpmyadmin allows you to enter two rows to your table at once y default.
Check the screen shot to see mine.

Now each row of the table will represent each page e.g home, about

For the first row, we will fix the content for this page

1. title : Put the title of the page here e.g Home Page
2. Header : You can put anything here e.g Welcome to My CMS 2.3
3. body : Copy and paste the lorem Ipsum content here


For the second row i.e the about page information

1. title : Put the title of the page here e.g About Us
2. Header : You can put anything here e.g About My CMS 2.3
3. body : Copy and paste the lorem Ipsum content here

Lastly : Click the "Go" button beside the "Reset" button.

Re: Take Your Web Development Skill/Career To The Next Level By Creating A Web App by MCzubby247(m): 3:13pm On Sep 15
kreativemind:


1. Am sorry to say this, as far as i know. There is no shortcut to it although some frameworks or platforms makes it easy. Especially in the Hybrid app department. Where you will use your knowledge of HTML, CSS etc and AngularJs e.g You can use Ionic Framework.
A lot of technologies are also coming out. Sometimes this is scary..... cheesy....very soon mobile app development will be like drag and drop things. But for now you will still need to work ooooo. No shortcut sir.
For me you are already on the right track.
What i normally advice people is to do some research on the language or skill that they want to learn before going to bootcamp or watching some video tutorial. While all this bootcamp and video tutorial are good, they will help you more when you have a basic understanding of what you want to learn and why you want to learn it.

2. Regarding the visa and the bootcamp. Normally, i don't know why you want to get a visa but i can tell you this.
There is nothing wrong with going to bootcamp but you don't have to go before you master it. Though bootcamp make it easy because of the environment but many good programmers don't go to bootcamp before they become an expert. I learn from ebooks and video tutorial and it really helps me a lot. Although what i should have cover in a matter of two weeks if i attend the bootcamp. I may have to do it in a month since am doing it alone and a lot of factors can affect my focus.
Now, so far the bootcamp is free, there is nothing stopping you from going, believe me, what you will learn in few weeks will really set a foundation for you so much that all others things that you will learn on your own will become easy for you and you will not have to forfeit your travel. Just remain focus and know that you are different from the others that attend the bootcamp, you have limited time, so strategies things that will make it easy for you and fun as well.

Never forget the fun part. Don't be like many programmers that thought frowning there face shows that they are a good programmers. Your brain need to relax to process more code...... cheesy cheesy cheesy cheesy......

Am always here to help you. All the best bro
thanks bro for prompt response.
like programmers in Nigeria, how much so they earn averagely especially mobile programmers
Re: Take Your Web Development Skill/Career To The Next Level By Creating A Web App by kreativemind: 4:09pm On Sep 15
MCzubby247:

thanks bro for prompt response.
like programmers in Nigeria, how much so they earn averagely especially mobile programmers

It depends. Some mobile app developers have a salary of 250k/month averagely. while some is like 400k/month. and some is not up to that. But am not referring to junior mobile app developers.

Freelancers can make more than that or less than that. So it all depends on a lot of factors.
Re: Take Your Web Development Skill/Career To The Next Level By Creating A Web App by Doughboysss: 7:46am On Sep 16
Good morning sir

Updates

Re: Take Your Web Development Skill/Career To The Next Level By Creating A Web App by kreativemind: 9:50am On Sep 16
Doughboysss:
Good morning sir

Updates

Wow, very good sir.

Good morning
Re: Take Your Web Development Skill/Career To The Next Level By Creating A Web App by kreativemind: 10:55am On Sep 16
Next : We will put the information on the database table on our site

1. Create a query and store it in a variable. We are going to use id = 1 to load the information on the first row of the table that you created i.e Home Page.
$q = "SELECT * FROM pages WHERE id = 1";
2. Then store the result function in another variable. Use the variable that you created for the database connection variable in your setup.php file(Mine is $conn).
$r = mysqli_query($conn, $q);

3. Convert the $r into an array(We will use an associative array. Array hold more than one pices of information. We need a key i.e [] and a string i.e ' ', this tells it what it needs to find. Now go your title and body and use the $page to load the information from the database
$page = mysqli_fetch_assoc($r);

4. Use echo $page['your column name in the database ']; to display your data from the database
e.g for the title, instead of <title><?php echo $page_title .' | '. $site_title; ?></title> , you use this

<title><?php echo $page['title'] .' | '. $site_title; ?></title>

ii. instead of <h1>header here</h1>. You use this

<h1><?php echo $page['header']; ?></h1>

Do the same thing for the body

5. Reload your page.

Re: Take Your Web Development Skill/Career To The Next Level By Creating A Web App by kreativemind: 10:55am On Sep 16
Show the screenshot of your work guys............................
Re: Take Your Web Development Skill/Career To The Next Level By Creating A Web App by Doughboysss: 12:30pm On Sep 16
Updated

Re: Take Your Web Development Skill/Career To The Next Level By Creating A Web App by kreativemind: 5:01pm On Sep 16
Doughboysss:
Updated

Very good. I noticed that you did not use $page[' '] for the page title
Re: Take Your Web Development Skill/Career To The Next Level By Creating A Web App by Doughboysss: 8:14pm On Sep 16
kreativemind:


Very good. I noticed that you did not use $page[' '] for the page title

Oops my bad

I will fix that
Re: Take Your Web Development Skill/Career To The Next Level By Creating A Web App by kreativemind: 4:30pm On Sep 18
Good afternoon guys....................
Re: Take Your Web Development Skill/Career To The Next Level By Creating A Web App by Collins4u1(m): 4:35pm On Sep 18
kreativemind:
Good afternoon guys....................


fire downnnn sir.
Re: Take Your Web Development Skill/Career To The Next Level By Creating A Web App by kreativemind: 5:04pm On Sep 18
Okay. Thanks

Now let us trim down our code and remove the query from the index.php and put it in the setup.php. Then reload the page to make sure that everything still works

Re: Take Your Web Development Skill/Career To The Next Level By Creating A Web App by kreativemind: 5:07pm On Sep 18
Now, what we had done so far is pretty cool, but we want to load our page dynamically from the database using a single page.
So, let us dive in........................


See you there

(0) (1) (2) (3) (Reply)

Garage48 Winner's Idea - "A call Center Application"? / Hospital Management System Program. / Andela Labs

(Go Up)

Sections: politics (1) business autos (1) jobs (1) career education (1) romance computers phones travel sports fashion health
religion celebs tv-movies music-radio literature webmasters programming techmarket

Links: (0) (1) (2) (3) (4) (5) (6) (7) (8) (9)

Nairaland - Copyright © 2005 - 2017 Oluwaseun Osewa. All rights reserved. See How To Advertise. 164
Disclaimer: Every Nairaland member is solely responsible for anything that he/she posts or uploads on Nairaland.