facn3 / mashrou_ghazal Goto Github PK
View Code? Open in Web Editor NEWproject autocomplet
Home Page: http://tiny.cc/MashrouGhazal
License: Apache License 2.0
project autocomplet
Home Page: http://tiny.cc/MashrouGhazal
License: Apache License 2.0
In handler.js you are using a mixture of ES5 and ES6. Eg
ES6 arrow function
fs.readFile(__dirname + '/words.txt', (err, data) => {
if (err) {
ES5 function
function handler(request, response) {
var url = request.url;
For consistency I would suggest picking one and sticking with it. In the back end use ES6 where possible ๐
Deleted unnecessary comments and console.logs
Not sure how this has got here but in the text file there is this from a merge at some point.
<<<<<<< HEAD
Make sure when you merge with master all conflicts are resolved and you have removed all of the things above.
Its on line 1 and also at the end of the file.
No tests yet? The file and packages (tape and tap-spec) shouldn't be there if they aren't being used at all. I understand its hard to test this week but some tests on the ways you are filtering data would have been nice.
The autocomplete function is actually an xhr request and should probably be renamed to something that suggests this.
I would also add it might be nice to make the xhr function a generic and reusable function. This could then be reused to send an xhr request to somewhere else and actually render some search results on the page.
I am typing and getting suggestions but are the suggestions all the words ever?! Or have you got a theme for your website? If you do that should be made clear to the user ๐คทโโ๏ธ
It is good practice to put images for the readme in an issue then use the url in the issue. This means if you have lots of images in the readme they aren't in the way of the images actually for your project. It's not a big point but just worth noting for the future.
i.e.
thats for the handler.js files
server-side .js files
an html files, js folder and css folder
the test files
At the moment when you submit the search it takes you to a 404! What is supposed to happen at this point?
Avoid the use of any global variables, for example, your arr
variable in handler.js
, there shouldn't be a need for the use of global variables.
try to extrapolate the functions that actually use that variable and then write a wrapper to them where the variable is only defined there
Linking index.js to handler.js
this file is not a backend source code and therefore should not be in the src folder if you still want to keep in src then adding a folder called dictionary helps.
The search bar looks huge, however if you type a really long word the text starts disappearing as another element hides it.
It looks from the url you have supplied in the repo that you are hosting on heroku
http://immense-ravine-82923.herokuapp.com/
In your package.json you have installed @google-cloud/nodejs-repo-tools
which is for a google cloud service. Is this being used still seeing as you have heroku? If it is unused it should be uninstalled and the app.yaml file removed as well.
Customizing the index.html
I.E
Overall, your github flow is nice ๐
issues
I love the titles and descriptions for your issues, they show what you are working on, which is great! Don't forget to open an issue for every feature/part of code you are working on.
commits
You almost always reference an issue when you commit changes, which is great! โจ
Don't forget that if you don't have an issue, you can open one before you commit your changes, but of course the best option is to create an issue before starting to work on something.
pull requests
Your pull requests have better titles and descriptions, and most of them reference an issue. Try to assigns your team members as reviewers, so all of you go over the code before merging it. This is your chance to approve โ
request changes โ๏ธ or ask any question about the code โ
Please don't make any changes on master ๐ฑ even if it seems like a small change. Every change should come from your code editor and terminal.
contributions
Try to aim to split the work evenly between all of the team members. You can see the current graph here.
You can do it by making sure you swap roles and laptops all the time โฒ๏ธ
picking it up in the audit - perhaps a typo.
it would be cool if there was a way to know if there are no results found for the autocomplete
โ๏ธโ๏ธโ๏ธโ๏ธโ๏ธโ๏ธโ๏ธโ๏ธโ๏ธโ๏ธโ๏ธโ๏ธโ๏ธโ๏ธโ๏ธโ๏ธโ๏ธโ๏ธโ๏ธโ๏ธโ๏ธโ๏ธโ๏ธโ๏ธโ๏ธโ๏ธโ๏ธโ๏ธโ๏ธโ๏ธโ๏ธโ๏ธโ๏ธโ๏ธโ๏ธโ๏ธโ๏ธโ๏ธโ๏ธโ๏ธโ๏ธ
There is commented out code here which should be removed.
You shouldn't be using px in your css anywhere. Use %, em or rem for better responsiveness.
Creating a drop down menu with pre-setup words from the auto complete to choose from
Would have been good to see more on the following:
there is a bit of a functionality problem < because that your data is just one word its passing but because your always searching for the the last word , if I searched for one term of two words that you have it in the data as one term of two words it wouldn't find it because it is going to look for a term that starts with the second word in your search term.
good idea to use the url.parse to parse it into a url object.
good job guys ๐ ๐
i'm not sure if its possible because our group didn't implement datalists, but would it be possible to hide the arrow icon? not necessary as the dropdown appears automatically....
๐๐๐๐๐๐๐๐๐๐
๐๐๐๐๐๐๐๐๐๐๐๐๐
๐๐๐๐๐๐๐๐๐๐
๐ ๐ ๐ฆ ๐ง ๐ฉ
Love the fact you are including a diagram of the architecture ๐
The relationships between server, handlers and autocomplete in the diagram seems a bit weird as all the data/logic is going back and forth between all of them. My understanding of the logic for this project would be something like:
server <--> router <--> handlers <--> autocomplete logic
Creating a css file
To remove some of the messiness from your handler file it would be better to have a router.js. This would help me to understand the code as well where the router.js is only directing to handlers based on url and the handler.js is handling the data/calling other functions to do so. Please modularise your code.
A handler function should be created in the src/handler.js file so that the server will call each time it gets the request. The handler should initially response to all the requests related to the public files, index.html, css and etc...
Please please sort out indentation. Run atom beautify or prettier to sort it all out for you. This shouldn't be an issue but it makes it harder to read code if things are not indented properly.
Set up the server is it can response to the client-side
A declarative, efficient, and flexible JavaScript library for building user interfaces.
๐ Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
An Open Source Machine Learning Framework for Everyone
The Web framework for perfectionists with deadlines.
A PHP framework for web artisans
Bring data to life with SVG, Canvas and HTML. ๐๐๐
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
Some thing interesting about web. New door for the world.
A server is a program made to process requests and deliver data to clients.
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
Some thing interesting about visualization, use data art
Some thing interesting about game, make everyone happy.
We are working to build community through open source technology. NB: members must have two-factor auth.
Open source projects and samples from Microsoft.
Google โค๏ธ Open Source for everyone.
Alibaba Open Source for everyone
Data-Driven Documents codes.
China tencent open source team.