Weather app with react

SerafimPoch · February 13, 2018, 8:59pm

Hi, I want to change my temp by click to buttons c and f. I made checker, so if it’s true temp convert to farenheit else to celcium. But it does not works.
If you find a solution how to fix it please comment below. Thanks =)

gist.github.com

https://gist.github.com/SerafimPoch/1734749916f9bbe3f1632983a8aa8928

Buttons.js

export const Faren = c => Math.round(c * (9 / 5) - 459.67);

export const Celc = k => Math.round(k - 273.15);

Geo.js

export const buildRequestUrl = (lat, lon) => {
  const key = "b8a59b301233a16e12819fc3b17ebc57";
  return `http://api.openweathermap.org/data/2.5/forecast?lat=${lat}&lon=${lon}&APPID=${key}`;
};

export const getCurrentLocation = () => {
  return new Promise((resolve, reject) => {
    navigator.geolocation.getCurrentPosition(resolve, reject, {
      enableHighAccuracy: true,
      timeout: 5000,

This file has been truncated. show original

Weather.js

import React, { Component } from "react";
import { buildRequestUrl, getCurrentLocation, extractPosition } from "./Geo";
import { Faren, Celc } from "./Buttons";

class Weather extends Component {
  constructor(props) {
    super(props);
    this.state = {
      city: "",
      temp: "",

This file has been truncated. show original

Marmiz · February 14, 2018, 4:23am

All I can see in your methods is to toggle between the checker state:

  CelcConvert() {
    this.setState({
      checker: true
    });
  }

  FarenConvert() {
    this.setState({
      checker: false
    });
  }

I don’t see any update in the temperature value.
Why not a simple:

  CelcConvert() {
    this.setState({
      checker: true,
      temp: Celc(this.state.temp)
    });
  }

should probably be enough.

SerafimPoch · February 14, 2018, 11:27am

I’ve tried written like this

CelcConvert( ) {
this.setState({
temp: Celc(this.state.temp)
})

but if I pressed two times the value of temp is increased

Marmiz · February 15, 2018, 3:32am

It’s hard to pin down the error just by looking at a snippet of code.

In order to better help you it’s better if you could provide a workable example online.

Anyway to help you get started I created a quick demo of a component that convert temperature.
It’s not the most elegant solution by any means but should give you an idea of how to keep the state tracked: