Scribd
Upload
91 views20 pages

Six Weeks Summer Training Web Development Report

this is the report format

Uploaded by

SILVIUS yt
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF or read online on Scribd
91 views20 pages

Six Weeks Summer Training Web Development Report

this is the report format

Uploaded by

SILVIUS yt
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF or read online on Scribd
You are on page 1/ 20
MOVELY [PRROFESSIONAL MWINIVERSITY ‘Transforming Education Transforming India SIX WEEKS SUMMER TRAINING REPORT amin oo el evel lopment os a . Shivansh Upadhyay at S- 0°? Registration No: 11708962 Programme Name: B. Tech (CSE) Under the Guidance of Sarvesh Agrawal School of Computer Science & Engineering Lovely Professional University, Phagwara Gune-July, 2019) DECLARATION Thereby declare that I have completed my six weeks summer training at Intemshala online platform from 01/06/2019 to 20/07/2019 under the guidance of Sarvesh Agrawal. I have declare that I have worked with full dedication during these six weeks of training and my learning outcomes fulfil the requirements of training for the award of degree of Bachelor Of Technology in Computer Science and Technology, Lovely Professional University, Phagwara, \? Aye \ Date: 20/07/2019 @ Ve ys” , Acknowledgement 1 would like to express my sincere gratitude to Internshala, Mr. Sarvesh Agrawal (Founder and CEO) for providing their invaluable guidance, comments and suggestions throughout the course. I would specially thank Ms, Shruti my training mentor for constantly motivating me to work harder and for encouragement and invaluable assistance. Also, I would like to thanks to my parent for giving encouragement and support. Without their constant support, I might not be able to complete this training properly. I would also like SHIVANSH UPADHYAY eee? , a Cer icate: w INTERNSHALA TRAININGS CERTIFICATE OF TRAINING Web Development BT em nc "ay Jroring on Web Development, The taking program conséfed fy Boobttop, SQL and PHP We wish Shivansh al the best for future * it (CPU) with 2 gigahertz (GHz) frequency or above A minimum of 2 GB of RAM + Monitor Resolution 1024 X 768 or higher + A minimum of 20 GB of available space on the hard disk Browsers: + Chrome* 36+ + Bdge* 20+ + Mozilla Firefox 31+ + Internet Explorer 11+ (Windows only) + Safari 6+ (MacOS only) There is a lot more to say about it, Web site is actually laid out in three fundamental layers, namely: 1, Structure Layer: We use HTML to give structure and semantic meaning to the content, 2. Presentation Layer: Use CSS to give a layout and visual presentation to the content, 3. Behaviour Layer: Use JavaScript to give additional interaction to the website. HTML: HTML E] ESS ~S HS E) se? . Aes nym which stands for “ ati reatinig web pages and web applications. i lyper Text Markup Language” which is used for a In the late 1980's, a physicist, Tim Berners-Lee who was a contractor at CERN, proposed a system for CERN researchers. In 1989, he wrote a memo proposing an internet based hypertext system. Tim Berners-Lee is known as the father of HTML. The first available description of HTML was a document called "HTML Tags" proposed by Tim in late 1991. The latest version of HTML is HTMLS. Let's see what is meant by Hypertext Markup Language, and Web page. Hyper Text: Hypertext simply means "Text within Text." A text has a link within it, is a hypertext. Whenever you click on a link which brings you to a new webpage, you have Clicked on a hypertext. Hypertext is a way to link two or more web pages (HTML documents) with each other. Markup language: A markup language is a computer language that is used to apply layout and formatting conventions to a text document. Markup language makes text more interactive and dynamic. It can turn text into images, tables, links, etc. Web Page: A web page is a document which is commonly written in HTML and translated by a web browser. A web page can be identified by entering an URL. A Web page can be of the static or dynamic type. With the help of HTML only, we can create static web pages. Hence, HTML is a markup language which is used for creating attractive web pages with the help of styling, and which looks in a nice format on a web browser. An HTML document is made of many HTML tags and each HTML tag contains different content. @ css CSS stands for Cascading Style Sheet. CSS is wan ett tags.CSS is a widely used language on the web. HTML, CSS at oe ‘are om for web designing. It helps the web designers to apply style ens S is used to define styles for your web on, pages, including the a vgn in display for different devices and screen sizes, SGML cond = Markup Language) is the origin of CSS. It isa language that mA higuages. AS look and feel part of a web page. Using CSS, you can control the colour of S text, the style of fonts, the spacing between paragraphs, how columns are sized and laid out, what background images or colours are used, layout designs, and variations in display for different devices and screen sizes as well as a variety of other effects. CSS is easy to learn and understand but it provides powerful control over the presentation of an HTML document. Most commonly, CSS is combined with the markup languages HTML or XHTML There are many advantages of web development. You can write CSS once and then reuse same sheet in multiple HTML pages. You can define a style for each HTML element and apply it to as many Web pages as you want. To make a global change, simply change the style, and all elements in all the web pages will be updated automatically. CSS can be used to style HTML elements in three ways: 1, Inline: CSS rule applied as an attribute to the HTML element. Has the most, precedence. 2. Internal: Many CSS rules can be written inside the same HTML file for elements. Ithas less precedence than the above one. 3, External: CSS rules are written in a separate file and then linked to the respective HTML file. Has the less precedence. Advantages of CSS CSS saves time ~ you can write CSS once and then reuse same sheet in multiple, pages. You can define a style for each HTML element and apply it to as pages as you want, Pages load faster ~ If you are using CSS, you do io HTML tag attributes every time, Just write one CSS rule of a NY i to all the occurrences of that tag. So less code means faster download ti Ne Easy maintenance — Anew change, simply change the style, and all elements in all the web pa e ies automatically. seen HTML ~ CSS has a much wider array of attributes than HTML, so you can ay a far better look to your HTML page in comparison to HTML attributes. Multiple Device Compatibility ~ Style sheets allow content to be optimized for more than one type of device. By using the same HTML document, different versions of a website can be presented for handheld devices such as PDAs and cell phones or for printing. Global web standards — Now HTML attributes are being deprecated and it is being recommended to use CSS. So it’s a good idea to start using CSS in all the HTML pages to make them compatible to future browsers. Limitations of CSS: * Ascending by selectors is not possible © Limitations of vertical control * No expressions No column declaration Pseudo-class not controlled by dynamic behaviour Rules, styles, targeting specific text not possible CSS frameworks are the pre-planned libraries which make easy and more standard compliant web page styling. The frequently used CSS framework is Bootstrap which I have learned in this training. Bootstrap: Pee err ts EiBootstrap DOR Co Cat ec cet oe aye ami open-source JavaScript framework developed by the team at Twitter. They Used HTML CSS Js for building user defined interface! We can say it “Front-end- framework”. Bootstrap is a CSS based framework used to make websites responsive. The Purpose of bootstrap is to make faster responsive websites, which will adjust itself on all devices like Mobile phones, tablets, computer, Laptop and all. Bootstrap is the world’s most popular front end framework to develop mobile first, responsive website very easily. Itis very easy to get started with, itis s very quickly. The highly customizable, and you can develop wet Bootstrap community is pretty huge as well. Earlier whenever we are writing CSS we used to define all the properties in the separate CSS file that we want to attach the separate CSS file, wherein bootstrap they have already written some classes in the bootstrap.css file. You just have to import that CSS file and use their classes. In addition, Bootstrap requires Jquery to work. Jquery is a popular and widely used JavaScript library which both simplifies and adds JavaScript cross-browser compatibility. Bootstrap can be boiled down to three main files: + Bootstrap.css ~ a CSS framework + Bootstrap.js~ a JavaScrip¥/Jquery framework + Glyphicons ~ a font (an icon font set) In addition, Bootstrap requires Jquery to work. Jquery is a popular and widely use JavaScript library which both simplifies and adds JavaScript roe Advantages of Bootstrap yor The biggest advantage of using sows Wns with free set of tools for creating flexible and responsive web lay, as common interface components, Here are some more advantages, “vt Mol ‘opt for Bootstrap: ue . Si {Oo you can save lots of time and efforts using the Bootstrap ie lesign templates and classes and concentrate on other fevelopment work. + Responsive features — Using Bootstrap you can easily create responsive designs Bootstrap responsive features make your web pages to appear more appropriately on different devices and screen resolutions without any change in markup. + Consistent design — All Bootstrap components share the same design templates and styles through a central library, so that the designs and layouts of your web pages are consistent throughout your development. «Easy to use — Bootstrap is very easy to use. Anybody with the basic working knowledge of HTML and CSS can start development with Bootstrap. + Compatible with browsers — Bootstrap is created with modern browsers in mind and it is compatible with all modem browsers such as Mozilla Firefox, Google Chrome, Safari, Internet Explorer, and Opera. + Open Source — And the best partis, it is completely free to download and use Future Scope One thing we can all agree on is that we need to understand what will happen in the future to Bootstrap, for the sake of web developments future. Bootstrap’s Github states that as of now insert date) they’re almost done with V4.1 which is concerned with a constant grid system, utilities, and small new features. They're also working on V4.2 that promises to bring enhancements to forms and components. The conclusion we can draw from this is that the people behind Bootstrap are very invested in it, super hard working and definitely continuously. That's the first good sign. “aNOn behind is the other. Let’s face it, any framework backed by a huge compan; makes all the sense in the world. As I was saying earlier, a huge See sk funds, — SQL: Structured Query Pe) AS loads of SQL is Structured oe ee \gude> which is a computer language for storing, manipulating in and retrieving dajassfored in a relational database. The letters are NOT an acronym for Stryctu Dose SQL is a derivative of a language originally created by IBM ,, Which was an acronym for Structured English Query Language. It was a query language whose syntax was a form of structured English. The syntax of SQL retains the property of being a form of structured English, and is still a query language. SQL is the standard language for Relational Database System. All the Y Relational Database Management Systems (RDMS) like MySQL, MS Access, Oracle, Sybase, Informix, Postgres and SQL Server use SQL as M uy S QL: their standard database language. A database is an organized collection of data, so that it can be easily accessed and managed. You can organize data into tables, rows, columns, and index it to make it easier to find relevant information. The main purpose of the database is to operate a large amount of information by storing, retrieving, and managing data. There are many dynamic websites on the World Wide Web nowadays which are handled through databases. For example, a model that checks the availability of rooms in a hotel. It is an example of a dynamic website that uses a database, Advantages SQL is widely popular because it offers the following advantages ~ + Allows users to access data in the relational database management systems. + Allows users to describe the data. oe + Allows users to define the data in a database and manipulate that we + Allows to embed within other languages using SQL neo pre- compilers. LF ce + Allows users to create and drop databases agdtya + Allows users to create view, stor ) functions in a database. © Allows users to set permis gy les, procedures and views. \* Future we, s 's the backbone of every relational database and many non-relational ayes currently is no viable replacement for SQL though more people are using SQL generators than ever before, such as tools that let you diagram your database graphically or “code first” methods which allow you to design your database using code, SQL isn’t going anywhere in the near future and if you are doing serious transactional ‘work neither are relational databases. So, put it on your short list of languages you should learn sooner rather than later, and certainly before designing an application. PHP: Hypertext Pre-processor PHP is a server side scripting language that is embedded in HTML. It is used to manage dynamic content, databases, session tracking, even build entire e-commerce sites. It is integrated with a number of popular = databases, including MySQL, PostgreSQL, Oracle, Sybase, Informix, and Microsoft SQL Server. It is powerful enough to be at the core of the biggest blogging system on the web (WordPress). It is deep enough to run the largest social network (Facebook). Itis also easy enough to be a beginner's first server side language! Common uses of PHP + PHP performs system functions, i.e. from files on a system it can create, open, read, write, and close them. + PHP can handle forms, i.e. gather data from files, save data to a file, a? iP. you can send data, return data to the user. + You add, delete, and modify elements within your databas + Access cookies variables and set cookies. + Using PHP, you can restrict users to adhe of your website. + Itcan encrypt data @ We can secure om ‘ oO But, in this technical age, no one technology is wake Buif Gg waht to choose a better option we choose PHP. Here in this thing, 1 os the best option, AN lity over intemet S PHP in blogging, 3. CMS supporting PHP 4. PHP and MySQL 5. Simplicity of PHP 6. Regular updates in PHP Laravel is certainly one of the most widely accepted and currently the most relevant PHP development framework available to make the developer's efforts even more effective, faster and easier. Much of it is due to the MVC architecture it has brought into the picture, which has essentially changed the shape of web development for the better. Reason for choosing Web Development Simple answer I loved it. [loved the thrill. I love to see my imagination come to life. Iloved gadgets. I choose to be a web developer to bring my ideas to life and help others see what I think a better world looks like. World Wide Web is everywhere or everyone is on World Wide Web. These are few reasons: 1. Front-end web developers are in demand. Whether you want to work for an organization or as a self-employed freelancer, front-end web developers are in demand. In fact, the Creative Group has named front-end web development one of the Top 10 Creative and Marketing jobs of 2017. 2. It’s a lucrative career. Front-end web development pays well. Age ayy Creative Group Salary Guide, a front-end web ons 5 of experience can earn from $80,000-$119,500. 3. Flexibility. As a front-end developer, you cai anywhere, including home. This makes it one of the atone you can choose. The skill set Ch you acquire allows you to wow nt areas like Image editing, UX/UI, mobile development one 4, Creativity. Pi ‘web development is all about creativity and creative ing, probl Sy ‘As a front-end web developer, you'll have the skills to build RS ‘websites to create the best possible user experience. YS career options. Online presence has become a main factor in all sectors and client/user engagement is a constant challenge for companies. Whether you choose to work for corporations, non-profits or become a self-employed freelancer, you can create a successful career. 6. A constantly evolving field. Front-end web development is an exciting career because it’s always evolving and constantly changing. This means you'll always have the opportunity to interact with new tools and learn new skills, keeping you engaged in your career. It’s a field that provides many opportunities for hands-on learning, Web gave us all a lot. I want to thank each and every one who put their work in making our life easy and that is why I choose to be a web developer now it is my turn to make people life easy and make this world a better place. Learning Outcomes From this training of 6 weeks which we underwent in our summer vacation I learnt to develop front end web pages using html, ess and Bootstrap and server side scripting using PHP and accessing, retrieving and manipulating databases using SQL. This technology will help me in be able to create responsive web pages. This technology my future in getting job and I will help us in future in many ways: The web is regularly evolving and developing, serving the population throughout the world, Many people are wondering what the web development future will bring, Simil Oe many predictions (sources), we are just able to find the indications and er ds oP Wieb development that can help to point us in the right direction, Some I are an update toa previous trend which expels all its drawbacks tiles oon new to the field, Role of Artificial Intelligence (AI) in s En ‘Whenever there is a mention a gl web development, you cannot lack the topic of artificial intelligence. tee 5, Nia has undergone a lot of research and advancements. Al-enabled chat ein ing ae ae will embed machine learning algorithm and APIs in the web rks s to fluence them to convey personalized and rich user experience. the cutting-edge enterprise digital assistants of your brand on the Alhas gained a lot of exposure in recent years, It is no longer a buzzword or some Hollywood Sci-Fi movie gimmick. AL is now a reality which is shaping our digital world, Al is extensively being used in almost every industry including manufacturing, transportation, and aviation and in almost all web and IT solutions. Artificial Intelligence in web development can seriously yield a great outcome for business owners by drastically increasing their conversion rates and ROL Imagine a user browsing through your website and based upon his/her interest in certain products, the web interface automatically shows the user some promotional offers centred around that interest so that he/she buys the product at that instance. Chatbots ~ Better Reply Predictions Google Trends shows exponential growth in Chatbots over time. Chatbots are nothing but programs powered by Natural Language Processing (NLP) and Machine Learning. Suppose you are looking to buy sports shoes for yourself. Now the basic step involves a Google search and then landing on a website. In the website, first you will search for the Sports Shoes and in the filter od select different options according to your requirement such as we ange etc. fon. After going through plenty of options, you decide to go on woh again a set of actions that need to be mn After that, there is -ckout, billing before you can actually place the order. Whereas in a Chatbot, ee is replaced by a Q&A session. ° Already, every égr player like Google, Microsoft, IBM, Facebook, Amazon etc. have in eh spen-source chat building tools and frameworks for developers. The normal user doesn’t need to download any other app for this but can use Facebook Messenger, Kik, Telegram etc. where they just need to search for the brand they are looking for and can start a conversation with the chatbot just like doing it with your friend. Role of Progressive Web Apps (PWA) in Web Design and Development Progressive Web Applications (PWA) is the future of web app development. PWA with Android Instant Apps is the next advancement in web industry after Responsive Web Design. Progressive Web Apps uses progressive enhancements that offers features similar to a native mobile application, Progressive Web Apps and Android Instant Apps combined together lets you create beautiful apps with material design and animations without the need of installing them on any device. Have you ever encountered a popup while browsing a website on mobile device saying “ADD TO HOME SCREEN”? When you click on the button, the application installs itself in the background. Now that application sits in your app drawer and offers the experience of a native mobile application, The app was downloaded from a web application without seeing the face of a Play Store or App Store. Isn’t it great!!! These apps offer offline access to the content without the need of an internet connection. Greater User Experience Al will help UX designers to reduce the analysis time by converting large aoe. something that can be accumulated quickly and efficiently. Today, everyone is recognizing the effect of Al in the so the number of people using Al increases, enterprises will focus =e 1g customer experience. Soon we will be entering the rans sface.e. no interface, According to the Golden Krishna, designer at Gpo| ate eyo book “The Best Interface Is No Interfa will ren xe'there is no need of physical screens thereby offering users with more io ah longer confined to developers and data scientists anymore. As the world is changing rapidly it becomes important for the designers to start thinking beyond displays and interfaces. We should not limit ourselves to what we are currently having but should also focus on inspiration from anything and everything as today the whole world is an interface. Voice Based Search Voice-based search has recently gained a huge momentum due to the introduction of various Virtual Assistants like Google Assistant, Amazon Alexa, and Apple Siri and so on. With the increase in the use of these digital assistants, website development needs to look into the evolution of voice-based search. This voice-based technology will become a complete necessity in virtual shopping and e- commerce companies need to keep a close look into it. AL bots powered by voice and search will be the future of this technology. Gantt chart Week 0-7 so’? sa wy | S ‘Ending Week Starting Week Bibliography © hups://fonts.google.com/specimen/Roboto?selection.family=Roboto © hups://jquery.com/downloads/ © hups://getbootstrap.comy/docs/3.3/components/ © http://download.cnet.com/WampServer-64-Bit/3000-10248_4-75544590.html © -hups://trainings.internshala.com/ © https://www.w3schools.com/ © hups://www.wikipedia.org/ © -hups://www.tutorialspoint.com/ © -hups://www.geeksforgeeks.or © -hups://www javatpoint.com/ vor

You might also like