I have a task of making a search bar in React. When you type at least 3 characters in, the suggestions start popping up. Then, after selecting one, the related photos from Unsplash show up on the page.
I've already got two separate components - a search bar that will give suggestions from a hard coded / provided array and a search bar that will show Unsplash photos after typing a word.
But I don't know how to connect them - Do I need an array with Unsplash keywords? But how do I obtain it? I don't think I should be preloading all millions of photos first, do I?
Thank you for the answers.
In documentation of the project theres no word about returning suggestions, so I think they don't support this.
If you ask how is it working on production - api is returning an object with 5 suggestions related to sent query. You can check this in "Network" tab when you type something into the searchbar on their website, just paste the link they fetch into your browser.
Does it answer your question?
Related
When we get a sharable link for an answer here, It gives the link with a hash parameter and when the link is loaded, it scrolls down and highlights the particular answer with a color. It works even if there are a lot of answers with pagination enabled. It automatically goes to the page and highlights the answer. How does that work?
I am working on a project where the situation is kind of the same as this and I have managed to achieve this without pagination. I have used React JS(along with react-router-dom for routes) for the front end and Django Rest Framework for the backend.
I have a server-side pagination enabled list of answers and I can travel through pages in the front-end as well. But like earlier it does not highlight a particular answer with the hash parameter in the url if that answer is not on the front page. I have to manually give the page number where the answer exists and that is the only way it works for now.
Is there any way to travel though pages and find the answer automatically and highlight it?
Can I do the same thing as it does here in Stackoverflow with these frameworks and if yes, how?
Any answer would be great!
Thank you!
Hi I’m building a front end web app using reactjs, my app will map over different array of dogs/cats/animals with multiple props and a couple images each. The ui has a search box which then filters out relevant animals.
My question is if my list were to get quite large, do I need to have it stored in a back end ? Or can it all be stored in front end, there will be no sensitive information or anything. So im not worried about security. I do not need to receive any information from the users. Basically it’s just a website for people to browse through.
And my second question. Once deploying to a host, Im currently leaning towards AWS. Is updating/adding/subtracting from my arrays simple as deleting the file and adding the new one into the bucket ??
Sounds exciting! But let's first back up a bit, and take stock of what we're trying to do. Essentially: we want an app that will show a bunch of images with functionality (e.g. filtering).
All images/photos (e.g. this cat photo) are hosted somewhere. Period. So, you can be the one responsible for hosting the images, or you could just have <img /> tags in your react app and refer to an existing img src links, where the image sources are being hosted by someone else.
So to answer your question: my question is if my list were to get quite large, do I need to have it stored in a back end ?
Not necessarily - if you're just referencing a bunch of images from a site that someone else is already hosting, then you're good.
As for this point: Or can it all be stored in front end, there will be no sensitive information or anything.
This question is kinda hard to answer, because nothing is really ever 'stored' in the front-end (let's ignore caching). Images live on the server, and the client (e.g. your chrome browser) makes requests to the server to get the images.
Now: if you want to upload your own photos or let users upload their photos. That's a very different story.
You would want to use s3 buckets. They could host your images.
However, based upon your post, I really think you should start step-step, and not host your own images (i.e. not have a backend), and instead just start by using images already on the internet. Good luck :)
Closed. This question needs to be more focused. It is not currently accepting answers.
Want to improve this question? Update the question so it focuses on one problem only by editing this post.
Closed 5 years ago.
Improve this question
I want to prototype an app and I thought Apps Script could be a quick way to do this, but being new to Google toolset I need someone to put me in the right direction to figure what is available and what components I need to put together to get this working.
Here's what the app does:
I put in an order in a form on a web page. (Google Forms? App Script web app?)
Some inputs in the form are dynamically shown depending on previous inputs.
The inputs are validated.
There is a list of receivers with mobile numbers (Google Spreadsheets?)
When submitted, the order is sent to a web service (Twilio REST API) that sends SMS text messages to each of the receivers.
Before submitting I want to be able to see a preview of the generated text message and the total cost for sending SMS.
After submitting, the order is also logged (Spreadsheets?)
In the text message there is a link to a web page that is specific to that order for more details
I don't need specific code but I need to find out what to use for each step. Also any examples or samples that could help me on the way would be very useful.
Update - My specific question for now to get started is:
Is it possible to use Google Forms to have dynamic fields (entering data in one field defines next fields with their choices), custom validations (validations are more than regex and multiple fields are validated together) and previews (when entering data, show some live calculations)? If not, how can I use Apps Script with Html to do that?
Thanks!
So you might what to use a Google Form, I do not know what type of Order you are trying to do, but in my example I will be assuming that an order is some type of department work order that is submitted and you want it to send a txt message to "supervisors" so that they can review the work order.
Here is a poorly drawn overview of how I envision this.
Overview Image
How I would Start
Create your form.
When you create a Google Form it automatically creates a Google Spreadsheet.
You are able to input validate the data on the form itself OR if you are really picky, you can validate the data on the spreadsheet itself with Formulas or even app script itself.
Here is a start on setting rules on your form.
Email validation
Advance Validation(Pretty much everything else)
you set responses to direct the form to different pages or sections of the form based on an answer.
Image With example on how to base questions on previous answers
Prepare your spreadsheet
So you already have a sheet for your Form Submission. Lets make another Sheet for your receivers. This way you can edit your receivers mobile numbers so your App Script does all the heavy lifting by cycling through this sheet when sending the messages.
You can also add any other information you need
Google App Script
Ok, The fun part. Now you have code. This is where you can get everything else you want or need. I would first write a function that all it does is collect the receivers data from your receivers sheet. Link to SpreadsheetApp I would recommend looking at the guide to get you situated on how things work in App Script.
The Second function would be the Twilio API. I have not written anything for Twilio yet but here is what I found that I would use to get started to send a message. Of cousre you will have to modify it to cycle through your recipients and anything else you would want to do. I think this Post will be able to get the Twilio Door Open
Here is also Twilios Documentation on sending SMS
I think that is plenty information for you to get a leaping start into this very interesting project you have. If you have any further questions please ask. If I don't know the answers I can definitely help point you in the right direction.
You will first have to start this project before I can get into some detail.
Hope this helps !
I am creating a hybrid app (IONIC + AngularJS). Using Drupal as my Backend. I am using Drupal services and getting the JSON data.
I would like to improve the speed/performance of getting the data. Most of the data will be images.
On the first page, i just want a list of the user's firstnames. When you click on a name you get the details page for that user. This page contains a lot of images.
What is the best way of doing this?
If my list contains a 100 people with profile pictures. I don't want to download all this information. Just the information of the person that was selected from the list. Is this possible? Is this a good idea? I am sorry if this is dumb questions. I am a beginner.
Do you have a better suggestion on how to do this?
Thanks in advance
JSON
[{"firstName":"John", "Image1":"John.jpg", "Image2":"John2.jpg", "Image3":"John3.jpg"},
{"firstName":"Jane", "Image1":"Jane.jpg", "Image2":"Jane2.jpg", "Image3":"Jane3.jpg"},
{"firstName":"Sam", "Image1":"Sam.jpg", "Image2":"Sam2.jpg", "Image3":"Sam3.jpg"}]
Here are few links you might want to go through for performance
https://www.sitepoint.com/5-ionic-app-development-tips-tricks/
http://julienrenaux.fr/2015/08/24/ultimate-angularjs-and-ionic-performance-cheat-sheet/
http://www.gajotres.net/speed-up-your-ionic-application-using-these-techniques/
Regards.
I am importing products using Commerce Feeds. The products appear just fine on the front end and via Store > Products in the admin. However no products appear under Content in the admin area. I have tried clearing out the database, re-importing, re-indexing, flushing caches - nothing works.
Also this is bizarre and seemingly un-related, however I noticed it around the same time I realized my products were not appearing in the admin - there is a strange whitespace above my admin menu bar - which only appears on the Content page (also coincidently the page giving me trouble.)
Using Commerce Kickstart (commerce_kickstart-7.x-2.0-rc1) (Would love to upgrade to the latest release but I am unsure how to do this without losing a great deal of work. I have not found a good upgrade document - please chime in if you know something I don't!)
I feel kind of stupid now. I edited the admin/content view and saw there was a filter criteria which caused it to not display nodes of type "product_display." Evidently this is intentional behavior. I am guessing you are only supposed to manage products from within the store tab. Still wish I could figure out the cause of the phantom whitespace at the top though.