Umsetzung
Als Erstes machte ich mir Gedanken darüber, was mir am wichtigsten ist, bei der Vervollständigung meiner Suchbegriffe. Da ich für das Studium oft längere Zeit ein Thema recherchiere und immer wieder dieselben Begriffe suche, entschied ich mich für eine chronologische Darstellung der bereits getätigten Suchen. Weiter war mir wichtig, dass mir meine eigenen Suchanfragen als Erstes angezeigt werden. Deshalb entschied ich mich dazu, meine Suchanfragen und die der anderen User getrennt in einem Dropdown, anzeigen zu lassen. Weiter sprach ich mit Freunden und meiner Familie über ihre Ansprüche an eine Autovervollständigungsfunktion und fragte, wie ihnen mein geplanter Lösungsansatz gefiel. Viele teilten meine Ansichten. Sie bestärkten mich in meiner Entscheidung genauso weiterzumachen.
Obwohl mir schon zu Beginn des Projektes klar war, dass ich mich für ein sehr schlichtes Design entscheiden würde, machte ich mir dazu nur wenige Gedanken. Ich zeichnete ein Paar Wireframes und setzte das Projekt sehr abstrakt mit Adobe XD um.
Als es schliesslich an das Schreiben des Codes ging, tat ich mich sehr schwer damit. Ich versuchte aus früheren IM-Projekten Teile zu kopieren und diese zu einem Grundgerüst zusammenzufügen. Dies gelang mir zwar teilweise, jedoch fehlte mir die nötige Übung und Routine um das Ganze sinnvoll zu verbinden und umzusetzen. Da ich nicht mehr weiter kam, bat ich Wolfgang Bock um Hilfe. Gemeinsam bildeten wir ein neues Grundgerüst. Dank seinem Input konnte ich selbstständig am Projekt weiterarbeiten.
So funktioniert die Seite: In einem <input> Feld werden die Suchanfragen eingegeben und nach dem übermitteln der Suche in eine Datenbank eingetragen. Um diese später den verschiedenen Usern zuordnen zu können, richtete ich ein Register- und Login-Formular ein. Die ID dieser Accounts wird zusammen mit dem Suchbegriff in die Datenbank übergeben.
Die Suchbegriffe selbst werden durch eine <datalist> ausgegeben, welche mit Hilfe einer php-Funktion die nötigen Parameter aus der Datenbank abfragt. Sind die User nicht angemeldet, so bekommen sie eine chronologische Ausgabe der aller vergangenen Suchanfragen. Sind die User angemeldet, so bekommen sie zuerst eine Chronologische Liste der eigenen Suchbegriffe und erst anschliessend die Liste der allgemeinen Suchbegriffe.
In get_suche.php verlinkte ich Google um die Suchbegriffe in den Link der Seite zu geben. So wird der jeweilige Suchbegriff einfach in den Link einer Google-Suchanfrage eingefügt und die User landen direkt auf der Seite mit den Resultaten von Google.
Zum Schluss verknüpfte ich ein style.css, um das Ganze zu layouten. Ich entschied mich alles möglichst schlicht zu halten und lediglich auf die Usability einzugehen. Weiter schaute ich, dass die Seite sowohl auf dem Desktop, als auch auf dem Smartphone gut bedienbar ist.
Schwierigkeiten
Schon zu Beginn hatte ich Schwierigkeiten das ganze Projekt ins Rollen zu bringen. Mir fehlten sowohl das Wissen als auch die Routine, um zu wissen, wo ich beginnen sollte und mit welchen Mitteln ich das Ganze umsetzen kann. Weiter schienen mir zu Beginn schon die kleinsten Hürden unüberwindbar. Zum Glück lernte ich mit jedem gelösten Problem so viel dazu, sodass das nächste einfacher zu lösen war.
Weiter bemerkte ich erst sehr spät, dass <datalist> nicht von allen Browsern unterstützt wird. Somit musste ich Workarounds finden, um die Suchmaschine für alle Browser zu optimieren. Funktionierte die Suchmaschine zwischenzeitlich auf allen Browsern, so steht sie momentan nur in Safari (Desktop und Mobile) und Google Chrome (Desktop und Mobile) mit der Autovervollständigung zur Verfügung.
Leider fehlte mir am Schluss die Zeit weiter an dem Projekt zu arbeiten, weshalb der momentane Stand fürs Erste auch der Endstand ist.
Fazit
Im Grossen und Ganzen bin ich zufrieden mit meinem Projekt. Obwohl es natürlich noch stark verbesserungsfähig ist, funktioniert es auf mehreren Browsern vollständig und auf anderen leider nur zum Teil. Ich habe während der Arbeit an meinem Projekt viel gelernt und fühle mich sicherer im Umgang mit Code und den verschiedenen Befehlen, Funktionen und Tags. Vielleicht werde ich im nächsten Semester weiter an diesem Projekt arbeiten, das Ganze verbessern, fertigstellen und es sogar ausbauen.