How to Build an Autocomplete System Like Google | Ismail Raji | Skillshare

How to Build an Autocomplete System Like Google

Ismail Raji, Passionate Online Instructor

Play Speed
  • 0.5x
  • 1x (Normal)
  • 1.25x
  • 1.5x
  • 2x
9 Videos (49m)
    • 1- Welcome

    • 2- What you should know before watching this course

    • 3- Anlayzing and returning data

    • 4- Creating the interface

    • 5- The Keyup Event Part1

    • 6- The Keyup Event Part2

    • 7- getResults & displayResults Functions

    • 8- ChooseResult Function

    • 9- Next Step


About This Class

Greeting everyone and welcome to this course on how to build an autocomplete system using JavaScript and PHP.

Generally, an autocomplete system needs three different technologies:

  • Client-side language to communicate with the server: We will use JavaScript.
  • Server-side language capable of providing data to the client: We will use PHP.
  • Database to store data: To make our code as simple as possible we're going to use a file to store our data, but you can use a real database if you wish to.

Project's Principle:
The principle is simple but effective: when a user type a character in the text field, a search is done and the results are sent back to the navigator. The latter displays these results in a little frame located under the search field.We can then browse the results using the up and down arrow keys or the mouse cursor.If we choose one of the listed results, it will be automatically displayed instead of what was written by the user.

What are the requirements?

  • HTML/CSS: Basic knowledge to create a simple text field
  • PHP Basics:Things like variables, if statements, loops and arrays.
  • Javascript: We will use events and a little bit of Ajax(mainly the XMLHttpRequest object).Dont worry if you're not familiar with these two,I will do a quick introduction to them in this course

What am I going to get from this course?

  • At the end of my course, students will be able to rapidly build their own autocomplete system using HTML5,CSS3,JavaScript and PHP.This system can be used in more advanced projects like building a search engine.

What is the target audience?

  • This course is perfect for anyone who wants to learn how to create an autocomplete system from scratch





  • --
  • Beginner
  • Intermediate
  • Advanced
  • All Levels
  • Beg/Int
  • Int/Adv


Community Generated

The level is determined by a majority opinion of students who have reviewed this class. The teacher's recommendation is shown until at least 5 student responses are collected.

Ismail Raji

Passionate Online Instructor

Ismail Raji is a computer engineer but he likes to think of himself as a jack of all trades.

When not programming he can be found writing about personal development, working on a new course, or reading a book. 

He is also a big language lover, he speaks Arabic, French & English and tries to learn new languages.

The idea of helping others learn makes him so happy and satisfied, that's why he decided to start teaching online.

So join him n...

See full profile

Report class