Rasim Izhar Ali completed a 6-week internship at Systems Limited focusing on front-end and back-end web development. They created a static website called HUES Clicks that allows users to submit contact forms, and includes user login/signup panels. The site is dynamically loaded using PHP, stores form data in a database, and sends email confirmations. Ali gained experience with HTML, CSS, JavaScript, jQuery, AJAX, PHP and databases. They concluded the internship provided valuable lessons in technical web development skills and time management.
Web development on web was part of a project in the final year of Engineering to demonstrate the implementation and application of SaaS using Microsoft Silverlight.
The application facilitated creation of web pages without having a need to install any HTML editor based software.
This is an internship presentation that I created as part of the internship curriculum, you can use this presentation for a web developer internship presentation that you might need to give in your college.
If you want some animation please see Internship Presentation 2 that I uploaded.
It has basic web developer tools explained like Git, HTML, Java etc.
A personal Blogging website.
Language: PHP, MySQL, HTML, CSS
Developed By: Shahid, CSE, KU
Features:
The system we have developed allows users to create their own blog, where users can publish their own opinions.
In this system, there are admins who take care of the Blog.
If anyone wants to post first they will have to create a new blog as well as a site account.
The posts may be verified by the admins.
There has category list where posts can be saved by relevant category.
People can like, comment and share the posts
Full responsive, Compatible with pc, tab, and mobile devices
Like, Comment featured
Has pagination feature
Web development on web was part of a project in the final year of Engineering to demonstrate the implementation and application of SaaS using Microsoft Silverlight.
The application facilitated creation of web pages without having a need to install any HTML editor based software.
This is an internship presentation that I created as part of the internship curriculum, you can use this presentation for a web developer internship presentation that you might need to give in your college.
If you want some animation please see Internship Presentation 2 that I uploaded.
It has basic web developer tools explained like Git, HTML, Java etc.
A personal Blogging website.
Language: PHP, MySQL, HTML, CSS
Developed By: Shahid, CSE, KU
Features:
The system we have developed allows users to create their own blog, where users can publish their own opinions.
In this system, there are admins who take care of the Blog.
If anyone wants to post first they will have to create a new blog as well as a site account.
The posts may be verified by the admins.
There has category list where posts can be saved by relevant category.
People can like, comment and share the posts
Full responsive, Compatible with pc, tab, and mobile devices
Like, Comment featured
Has pagination feature
WEBLOG is a combination of both Blog as well as Novels. Blog contain the Information of various things related to Technology, Education, News, International, Business, Sports, Entertainment and ongoing college activities. The main aim of this project is to provide data to students in only one site. Students can gather the information from one site as well as give their feedback and create their own blog. Students can post their views and thought and analyze themselves. Besides all such core functionalities, the application also includes features like FAQ, request, feedback etc. so as to provide a satisfactory user experience.
Web Development with HTML5, CSS3 & JavaScriptEdureka!
With the commercialization of the web, web development has become one of the blooming industries. Learning web development enables you to create attractive websites using HTML, CSS, JQuery and JavaScript. Web development includes developing simple and complex web-based applications, electronic businesses and social networking sites. Being a web developer you can deliver applications as web services which is only available in desktop applications.
Become a complete developer by learning front-end and back-end technologies in this Full Stack Web Developer Course. These are just a few of the 40 different apps that are part of this brilliant course. With this course, you will not only learn a whole lot of different technologies, but also become a complete developer.
So, what are you waiting for? Let’s become a Master Developer with this Full Stack Web Development Bundle Course.
For More Info : https://www.eduonix.com/courses/Web-Development/the-full-stack-web-development?coupon_code=kedu15
Web design and web development are often used interchangeably. However these terms refers to unique aspects involved in the process of creating a website and making it accessible to the audience over internet. Learn the difference between web designing and web development by going through this slide. You will also find how the job of a web designer is different from a web developer by understanding the programing language and tasks involved in both these professions.
WEBLOG is a combination of both Blog as well as Novels. Blog contain the Information of various things related to Technology, Education, News, International, Business, Sports, Entertainment and ongoing college activities. The main aim of this project is to provide data to students in only one site. Students can gather the information from one site as well as give their feedback and create their own blog. Students can post their views and thought and analyze themselves. Besides all such core functionalities, the application also includes features like FAQ, request, feedback etc. so as to provide a satisfactory user experience.
Web Development with HTML5, CSS3 & JavaScriptEdureka!
With the commercialization of the web, web development has become one of the blooming industries. Learning web development enables you to create attractive websites using HTML, CSS, JQuery and JavaScript. Web development includes developing simple and complex web-based applications, electronic businesses and social networking sites. Being a web developer you can deliver applications as web services which is only available in desktop applications.
Become a complete developer by learning front-end and back-end technologies in this Full Stack Web Developer Course. These are just a few of the 40 different apps that are part of this brilliant course. With this course, you will not only learn a whole lot of different technologies, but also become a complete developer.
So, what are you waiting for? Let’s become a Master Developer with this Full Stack Web Development Bundle Course.
For More Info : https://www.eduonix.com/courses/Web-Development/the-full-stack-web-development?coupon_code=kedu15
Web design and web development are often used interchangeably. However these terms refers to unique aspects involved in the process of creating a website and making it accessible to the audience over internet. Learn the difference between web designing and web development by going through this slide. You will also find how the job of a web designer is different from a web developer by understanding the programing language and tasks involved in both these professions.
In this project I had given videos for almost each and every important location of the University of New South Wales. Also the User can know his current location. User can see all the Important Departments, Theatres and Services being provided by the University and see the videos associated to it. Apart from the project the learning of iPhone programming is what has been concentrated.
Summer Internship Report on Developing business promotional strategies and ma...Kartik Mehta
Mumbai University Black book of summer internship report on the topic of developing business promotional strategies and marketing through digital media and social media marketing.
Digital media are any media that are encoded in a machine-readable format. Digital media can be created, viewed, distributed, modified and preserved on computers.
C# Compiler portal system is a portal website that offer facilities to their users to run their Asp.net programs which anyone can view online by visiting the website.
We can help our clients better manager their websites and web content if we give them a CMS interface that is tailored to their needs. So instead of expecting them to use a one-size-fits-all admin template, we provide a client template that is tailored to those who will be managing the website through the CMS.
This presentation, delivered at the 2013 Joomla World Conference, illustrates the client template and how it can be tailored.
La presentazione di Marco Casario per il Codemotion del 5 marzo 2011 a Roma http://www.codemotion.it/
Si parla già molto di HTML5 e delle nuove specifiche che il linguaggio nella sua ultima versione introduce. Ma è davvero il momento giusto di investire su questo standard e migrare le proprie applicazioni? A che punto sono i browsers con il supporto ad HTML5?Il Flash Player scomparirà?Quale sarà il video codec definitivo supportato? Le domande sono molte. Lo scopo di questo speech è quello di cominciare a dare delle risposte analizzando con esempi concreti lo stato attuale del linguaggio HTML5.
On the top of every page, you need to check if the user is logged in as the administrator and redirect her to the log in page if they are not. You can do these using PHP sessions. .
‘Dynamic Admin Panel’ is an Admin Panel with both working front-end and back-end. It is created because of frustration with ‘static’ Admin Panel, which only works on the front-end and difficult to integrate with back-end (PHP and MySQL).
‘Dynamic Admin Panel’ main objective is to speed up web development effort by providing configurable and ready modules. Configurations can be made easily using the Control Panel, or programmatically. Use ‘Dynamic Admin Panel’ to create your own web application with the following benefits:
• Speed up web development by using ready modules
• Make changes quickly and easily using control panel
• Source code available for further modifications
‘Dynamic Admin Panel’ is not a theme or plug-in. It is intended to run on its own and you have to create your own web application using it (or get someone else to develop it). ‘Dynamic Admin Panel’ acts as a ‘blank web application’ which you can customize to your own needs.
It has several ready modules, which you can use right away and save you time.
• Secure Login
• Dashboard Page
• Website
• Create category
• View category
• Post Counter
• Gallery Image Counter
• Success Story Counter
• User Counter
• Insert Post To Home Page
• View All Post
• Delete Post
• Insert Image into Gallery
• View All Image
• Delete Gallery Images
• Insert Success Story
• View All Story
• Delete Story
• Logout
2. PAGE 1
ACKNOWLEDGEMENT
I would like to thank HR department for giving me the opportunity to
do an internship within Systems Limited. This was quite a great
experience I can learn from. It helped me to explore my skills and
increased my interest in web development (Front hand/Backend).
Special thanks to UI/UX manager Sohail Ahmed for being so
accommodating and understanding. He supports me a lot and also
supports my field of interest in backend development. He encourages
me a lot and I am very gratefulto him.
The environment was excellent in this company and my colleagues of
One Load make me happyevery time.
3. PAGE 2
TABLE OF CONTENTS
i. Introduction
I. Context Of Internship
II. Technical Aspect
ii. Solutions
I. Resolving Client Issues
II. HUES Clicks
iii. Discussion
I. Overview
II. HTML
III. CSS(Stylesheet)
IV. Javascript & JQuery
V. PHP(Database.php)
iv. Website Screenshots
I. Header Containing Slider
II. Content Area
III. Footer
IV. Login Popup
V. Sign up Pop up
VI. Form Submission Failed
VII. Indicating User On Runtime
VIII. Form Submission Successful Pop up
IX. Checking it on Email
X. Checking it on Database
XI. Admin Panel
XII. User Signup Successful
XIII. User Panel
v. Conclusion
4. PAGE 3
INTRODUCTION
“Life is one big road with lots of signs. So when you riding through the
ruts, don’t complicate your mind. Don’t bury your thoughts; put your
vision to reality. Wake Up and Live! ” – Bob Marley
I am student at Hamdard University studying B.E Computer System
Engineering in 6th
Semester. Since I find myself more interested in the
area of web development, I was unhappy to be assigned in UI/UX
Department in Systems Limited because my interest was in backend
development. But thanks to Mr. Sohail Ahmed who appreciates my
interest and let me do my work as a backend developer.
This report is a description of my 6 week internship carried out in
Systems Limited. In the following chapter details of the activities of my
team are given. Afterwards, I explain my role and tasks as a trainee and
give specific technical details about my main tasks. Finally, a
conclusion is drawn from the experience.
CONTEXT OF INTERNSHIP:
I was assigned different tasks related to front hand development.
Issues regarding the compatibility problems between IE , chrome
and different browsers. Web page was responsive but was margin
problems between browsers and the whole page disbalanced.
Making short hyper links for IE9 for managing their pages.
Making separate classes for different browsers in order to set
alignment.
Upgrading the website positioning and adding multiple things as
required by clients.
Also converting the PSD template to HTML and CSS code.
5. PAGE 4
Making static and dynamic website named HUES Clicks in
which the user can interact with us by filling the Contact us
form and all the details of users will be maintain in my database,
also I will get email of user details with form number when the
user had filled its form with correct details and user will also get
notification by e-mail that he has successfully submitted the
form. Also there is a login panel for user and admin and signup
process for user. In login panel for admin we can see all the data
in the grid of our users (Name, Email ID, Subject, Message, and
Time of Submission Form). In User login panel User can update
their information’s, Upload its picture on runtime just similar as
face book.
TECHNICAL ASPECT:
For the completion of the tasks the following web languages and
scripts have been used: HTML for the construction of the layout, CSS
for the design of the layout, JavaScript and JQuery for dynamic
functioning and JSON for data storage. Ajax for the call to server side
php scripts so that our data may be returned as json encode on
runtime. PHP for transferring the data to database and fetching data
from database. Also using the SMTP protocol for transferring the mail.
All the work has been done in Sublime Text Editor and My SQL wamp
Server version 2.0 and Apacheand Phpmyadmin for database.
6. PAGE 5
SOLUTIONS
RESOLVING CLIENTS ISSUES:
During the first half of my internship first of all I was assigned to code
a PSD template into HTML, CSS. After completion of that my senior
assigned me the issues as post by the clients. Firstly I was assigned to
make a short hyperlink for PDO (Petroleum development Oman)
website. I put it live and it works well in chrome and Firefox but there
was an issue that animation in short links was not supports by IE9 so it
was said by my senior to create a short hyper links without and
animation which do supports chrome, Firefox as well as IE version 9 to
11. This issue was resolved by my senior as it was urgentlyrequired.
Secondly, I was assigned multi issues of positioning of text and images
in IE browser. Also there was one problem with div which was at
correct alignment in chrome and Firefox but when we open it in IE we
faced a problem so we made a separate div for IE and by writing a
script i.e.) JavaScript we detect the browser that it is IE or not so we
show and hide the div by detecting the browser.
Hues Clicks:
After half of the period has been spent during internship I start
moving towards making a web application so I starting working
on a static website then after I dynamically loads the page for
user’s panel through which the user can interact with us by
filling the Contact us form and all the details of users will be
maintain in my database, also I will get email of user details with
form number when the user had filled its form with correct
details and user will also get notification by e-mail that he has
successfully submitted the form. Also there is a login panel for
user and admin and signup process for user. In login panel for
admin we can see all the data in the grid of our users (Name,
7. PAGE 6
Email ID, Subject, Message, and Time of Submission Form). In
User login panel User can update their information’s, Upload its
picture on runtime just similar as face book.
DISCUSSION
OVERVIEW
The Hues Clicks had been planned to consist of two parts front-end
and back-end development. The front-end is the part of the web that
you can see and interact with (e.g. Client-side programming). While
front-end code interacts with the user in real time, the back-end
interacts with a server to return user ready results. The front-end is a
combination of HTML, CSS and JavaScript coding. By using JavaScript,
modifications of the design of a web page can be made immediately,
however only temporary and visible only by the user. Normally the
user would not have rights to modify web content dynamically on the
server side.
Logically, administrators are the ones who deal with back-end
modification of databases for example, as they often contain sensitive
data which should not be available to see or modify by the general
public. Back-end programming languages include PHP, Java, Python,
Ruby and others.
I focused on both front hand as well as back end development in order
to create a standalone application by myself. Difference between front
hand and back end development is shown in below figure.
8. PAGE 7
HTML
This is contact us page html coding and there are multiple
panels in HTML .
CSS
9. PAGE 8
JAVASCRIPT & JQUERY:
All functionality of the modules has been programmed in JavaScript,
including jQuery and AJAX. jQuery is a fast and small JavaScript
library that offers manycuseful features that make event handling
among other things much simpler with can easy-to-use API that works
across a multitude of browsers.
AJAX, though not another programming language or library is a way of
using existing standards. It is the art of exchanging data with a server
and updating parts of a web page, without the need to reload the
entire web page.
I used the jQuery.ajax() handler which performs an asynchronous
HTTP (ajax) request. The request is sent to the translation library (or
the json file) leading to the creation of a JSON object upon success.
10. PAGE 9
PHP:
This is the php script for which the ajax will call this php and it will
follow if condition if user is opening is being log in and will follow else
condition if the admin is going to log in. I also include a database.php
which contains all the functioning in php.
DATABASE.PHP
11. PAGE 10
WEBSITE SCREENSHOTS
Header Containing Slider
Content Area
The red cross sign you can see is this because the user did not fill
it when it was submitting the form.
13. PAGE 12
Form SubmissionFailed
User when enter the wrong details and enter the submit the
following popup is displayed.
Indicating User OnRuntime
That the details he entered is correct.
14. PAGE 13
Form Submission SuccessfulPop Up:
Checkingit on E-mail :
The details user entered will get me by e-mail and this email will
come only in the folder Hues Clicks.
Checkingit On Database:
The user details I also got in my database with the time he
submitted.
15. PAGE 14
Admin Panel
In admin panel page we do have different tabs in which one is
Contact Form List in which all the user messages etc is displayed
in a grid form.
On clicking this grid will be displayed as:
UserSignup Successful
In this panel we will write details for user signup and that etails
will be stored in database as shown.
16. PAGE 15
UserPanel
This is the user panel whoever has signed up and after login
screen this will display with its details.
After clicking Edit Profile user will update its profile and in
runtime it is done.
17. PAGE 16
After all when you see your profile then you will get the
following result as shown.
All the information is also at database so whenever the user will
be login he will get the last updated profile.
Now a user will upload its profile picture and then you can see.
18. PAGE 17
Even after refreshing or after login after sometime this picture
will be there.
CONCLUSION:
In a nutshell, this internship has been an excellent and rewarding
experience. I can conclude that there have been a lot I’ve learnt from
my work at the Systems Limited. Needless to say, the technical aspects
of the work I’ve done are not flawless and could be improved provided
enough time.
As someone with no prior experience in JavaScript, Jquery, PHP, AJAX,
CSS,HTML whatsoever I believe my time spent in research and
discovering new languages was well worth it and contributed to
finding an acceptable solution to an important aspect of web
development that includes both front hand and back end development.
Two main things that I’ve learned the importance of are time-
management skills and self-motivation. Although I have often
stumbled upon these problems at University, they had to be
approached differently in a working environment.